css - 将鼠标悬停在链接上时，DIV 在 IE7 中移动

Question

当悬停在菜单链接上时，整个 DIV 在 IE 7 中向上移动。在 Chrome、IE 8,9 中一切正常。

当您将鼠标悬停在 Stores 链接上时。 DIV的LOGO、Search、Basket向上移动。

这是我的 CSS..

.storefinderdropdown { position:absolute; top:8px; float:none; width:270px; height:43px; border:5px solid #F1F1EF; background:#F1F1EF; z-index:10; margin:20px 0 0 335px;  font-size:10px; font-weight:bold; text-indent:3px; padding:0; display:block; }
.storefinderdropdown .SLErrorMsg { display:none; color:#f00; line-height:20px;}
.storefinderdropdown .SLbutton { position:relative;  display:inline; float:left; }
.storefinderdropdown .SLbutton input{ float:left; vertical-align:middle; }
.storefinderdropdown .SLbutton a{ float:left; margin:1px 0 0 3px; line-height:10px;  color: #fff !important; border: none; cursor:pointer; font-weight:bold; width:42px; height:14px;  background-image: linear-gradient(bottom, #335649 13%, #335649 57%, #335649 79%); background-image: -o-linear-gradient(bottom, #335649 13%, #335649 57%, #335649 79%); background-image: -moz-linear-gradient(bottom, #335649 13%, #335649 57%, #335649 79%); background-image: -webkit-linear-gradient(bottom, #335649 13%, #335649 57%, #335649 79%); background-image: -ms-linear-gradient(bottom, #335649 13%, #335649 57%, #335649 79%); background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.13, #335649), color-stop(0.57, #335649), color-stop(0.79, #335649)); background-color:#335649; border-radius:3px; padding: 5px; }

Answer 1

我在 I.E 中使用过开发者工具。帮助您解决问题。

看来问题在于您为#header 和.logo 设置的边距

   #header .logo{
    padding-bottom:0px;
    margin-top:15px;
    ....
    }

在 I.E. 中快速修复这个问题。并且仍然希望在其他浏览器中得到相同的结果是将 margin-top 替换为 #header 和 .logo 的 padding-top 。

希望这对您有所帮助。