开发者

IE7 Bug - the main-box moves to the left on hover

开发者 https://www.devze.com 2023-04-06 07:41 出处:网络
I\'m trying to fix this issue in IE7 that 开发者_如何学编程when you hover on it it won\'t remain in its position but will go to the left side. I\'ve tried display:inline but it won\'t work in this cas

I'm trying to fix this issue in IE7 that 开发者_如何学编程when you hover on it it won't remain in its position but will go to the left side. I've tried display:inline but it won't work in this case.

You can test it here: http://www.sneakyrascal.com/kayak/results.html

This is the code I am using for the main-box(the middle one):

.results #container{ 
    float:left;
    width: 527px;
    margin:38px 0 0 20px;
    padding-left:1px;
    position: relative;
    border: #ccc 1px solid;
    background: #fff;
}

Thanks in advance


The problem is caused by position:relative on #main-content. If you remove it the container will not jump any more:

#main-content {
    margin-top: 20px;
    position: relative; /* delete this */
}

Also you might have noticed that your .sites div was not lining up properly. Adding left: 0 will fix that:

.results #container UL LI.box .left-side .sites{
    width: 90px;
    text-align: center;
    position: absolute;
    bottom: 10px;
    left: 0; /* add this */
}


Huhh, weird bug, you can fix it by properly containing your #main-content id. Just add this to it:

display:inline-block;
0

精彩评论

暂无评论...
验证码 换一张
取 消