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上不起作用

回答

相關問題