浮动：正确的 IE7 错误答案

【问题标题】：Float: Right IE7 Bug浮动：正确的 IE7 错误
【发布时间】：2023-03-12 13:55:01
【问题描述】：

我无法弄清楚 IE7 浮动正确的错误！这是要了我的命。除了 IE7，我的 NAV 栏在任何地方看起来都很棒。我已经创建了一个特定的 IE7 CSS 并尝试了各种方法，但仍然没有成功。 link text

似乎LI 元素在.container 内的#NAV 之外浮动。

FLOAT:RIGHT 的任何 IE7 修复程序？

非常感谢。

这是我的代码：

.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>

【问题讨论】：

标签： internet-explorer-7 css-float internet-explorer-6

【解决方案1】：

根据您的描述，这个jsfiddle.net example 在 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;
}

【讨论】：