Float:对IE7 Bug

Question

我无法弄清楚IE7浮动吧!这让我很难过.除了IE7,我的NAV栏看起来很棒.我已经创建了一个特定的IE7 CSS并尝试了各种方法,但仍然没有成功. 链接文字

看起来LI元素浮动#NAV在.container内部之外.

任何一个IE7修复FLOAT:RIGHT？

非常感谢.

这是我的代码:

.container {
    width: 983px;
    margin: 0 auto;
    background: fuchsia;
}
ul#nav {
    height: 44px;
    margin: 32px auto;
    position: relative;
}
ul#nav li, ul#nav li a {
    display: block;
    height: 44px;
    margin-left: 3px;
    position: relative;
}
ul#nav li {
    padding-left: 0;
    height: 44px;
    position: relative;
    z-index: 10060;
}


<div class="container">
    <ul id="nav">
        <li><a class="navtop_7" href="#"></a></li>
        <li><a class="navtop_6" href="#"></a></li>
        <li><a class="navtop_5" href="#"></a></li>
        <li><a class="navtop_4" href="#"></a></li>
        <li><a class="navtop_3" href="#"></a></li>
        <li><a class="navtop_2" href="#"></a></li>
        <li><a class="navtop_1" href="#"></a></li>
    </ul>
</div>

Answer 1

根据您的描述，这个jsfiddle.net 示例在 IE7 中显示我认为您想要的方式。（为了将来的参考，请提供您想要实现的参考图像。）

.container {
    width: 983px;
    margin: 0 auto;
    background: fuchsia;
}
ul#nav {
    height: 44px;
    margin: 32px auto;
}
ul#nav li {
    display: block;
    float: right;
    background: green;
    padding-left: 0;
    width: 140px
    height: 44px;
}
ul#nav li a {
    background: blue;
    display: block;
    height: 44px;
    width: 137px;
    margin-left: 3px;
}