IE7不尊重显示：阻止<ul> <li> <a></a> </li> </ul>

Question

我正在尝试使用以下HTML标记进行简单的垂直导航：

<ul>
    <li><a></a></li>
    <li><a></a></li>
    <li><a></a></li>
</ul>

尽管display: block;和<li>元素都有<a>，但IE7似乎并不尊重包含div的整个宽度。关于这个的任何想法？

http://jsfiddle.net/6eKGL/

更新

我现在认为该问题与容器div的position属性有关，并且其宽度由<a>元素内部的内容决定。

Answer 1

这是IE-7问题解决后的更新小提琴。 http://jsfiddle.net/6eKGL/35/

演示：http://jsfiddle.net/6eKGL/35/embedded/result

CSS：

#ajax-search ul li a {
    display: block;
    /*min-width: 150px;*/ // Remove this rule and the IE-7 will start respecting the display block
    padding: 9px 18px;
}

请参阅以下IE-7

的屏幕截图

Answer 2

在overflow: hidden元素上设置<li>为我做了诀窍！

Answer 3

尝试在您的html中添加doctype，最好是html5或xhtml 1.0 strict。这样，IE7以标准模式呈现，而不是使用它自己的盒子模型。

另外，使用css重置。谷歌为“埃里克梅耶重置”。

的引用：

http://www.quirksmode.org/css/quirksmode.html

http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/

http://en.wikipedia.org/wiki/Quirks_mode

<强>更新

看到这个小提琴：http://jsfiddle.net/6eKGL/23/

Answer 4

为 ul 设置overflow:hidden，为 a 设置一些宽的宽度 http://jsfiddle.net/sergeir82/N2thx/

Answer 5

从“＃ajax-search ul li a {display：block; padding：9px 18px; min-width：150px;}”中删除“min-width”后尝试“