CSS显示：内嵌块和宽度：100％在IE6和IE7上不起作用

CSS display: inline-block和在IE6和IE7上不起作用。
有没有人有一些解决方案？谢谢！CSS显示：内嵌块和宽度：100％在IE6和IE7上不起作用

<style> 
nav {text-align: justify;} 
nav li {display: inline-block; white-space: nowrap;} 
nav span {display: inline-block; width: 100%;} 
</style> 
... 
<nav> 
    <ul> 
    <li>Home Page</li> 
    <li>Services</li> 
    <li>Clients</li> 
    <li>Portfolio</li> 
    <li>Contact Us</li> 
    <span></span> 
    </ul> 
</nav>

更新：
所以它工作正常，也对IE6，但在列表中有更多的话它看起来并不睦邻>“联系我们“：

nav { text-align: justify; } 
nav * { display: inline; } 
nav span { 
    display: inline-block; 
    position: relative; 
    width: 100%; 
    height: 0; 
} 
<nav> 
    <ul> 
    <li>Home Page</li> 
    <li>Services</li> 
    <li>Clients</li> 
    <li>Portfolio</li> 
    <li>Contact Us</li> 
    </ul> 
    <span></span> 
</nav>

来源

2010-07-05 Binyamin

无论如何，你需要什么'inline-block'？ – 2010-07-05 12:01:15

它使列表项目水平滚动而不是垂直滚动。 – Chris 2010-07-05 12:02:44

我还没有重新创建代码，但我可以告诉你，你不允许像这样嵌套在ul中的span元素。尝试改变span和li和id，看看你是否有更好的结果。

你想用这个做什么？

来源

2010-07-05 12:02:15 Chris

对于IE6和IE7，你可以尝试使用（在样式表中包含的条件注释）

display: inline; 
zoom: 1;

zoom: 1触发hasLayout这是类似的inline-block行为。但是，我同意上述评论者的意见，即不应该将span作为ul的直接子代。

来源

2010-07-05 12:05:15

它不起作用。 – Binyamin 2010-07-05 12:54:55

几点建议：

纠正你的HTML - UL应该只包含LI，不能跨
没有这样的事，作为一个NAV元素
尝试漂浮在李的使用浮动：左 - 你还应该在它们上设置一个宽度
如果你想要一个元素来填充页面的宽度，使用display：block;这将适用于所有浏览器 - 提供您的HTML是正确的！

看看的html validator，这应该帮助你与你的HTML错误 - 也有Firefox的一个伟大的验证插件，也没有工作。

来源

2010-07-05 12:51:11

'nav'是一个有效的HTML5元素。 – 2010-07-05 12:53:06

'nav'是html5标记 – Binyamin 2010-07-05 12:54:16

IE 6和7（实际上8）不会将您的样式应用于'标记，除非您首先在JavaScript中使用该名称创建标记。 IE对其不识别的标签不太好（参见例如''）。 – 2010-07-05 13:58:57

CSS显示：内嵌块和宽度：100％在IE6和IE7上不起作用

回答

相关问题