CSS溢出：隱藏列表的子彈？

我剛剛注意到一些有趣的東西。比方說，我有一個HTML列表：CSS溢出：隱藏列表的子彈？

<ol> 
    <li>Lorem</li> 
    <li>ipsum</li> 
    <li>dolor</li> 
    <li>sit amet enim. Etiam ullamcorper. Suspendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies. Curabitur et ligula.</li> 
</ol>

而這個CSS：

li { 
    white-space: nowrap; 
    overflow: hidden; 
}

的長文中的最後一項確實砍掉當它熄滅容器的寬度，符合市場預期。但！列表項目編號也受到overflow屬性的影響，因此未顯示。

然而，修改CSS是這樣的：

ol { 
    overflow: hidden; 
} 
li { 
    white-space: nowrap; 
}

按預期工作（文字都不會出門的容器，但顯示列表項）。至少所有這一切都適用於Firefox 4 beta10。

難道你不認爲編號受overflow影響有點不合邏輯嗎？爲什麼會發生？它是否是行爲？它是否在說明書中，還是僅僅是某個人忘記處理的怪事？

來源

2011-01-30 mingos

這是所有4個beta10行爲？還是你在其他瀏覽器上測試過？ – 2011-01-30 14:53:24

不，我沒有測試，因爲我並不在意解決這個問題（在`ol`上設置`overflow`就行了，我只是好奇） – mingos 2011-01-30 14:56:15

這是默認的行爲儘可能I'm意識到，如果list-position爲outside，一個ul的項目符號和編號的ol鴕鳥政策表演。至少在Firefox中我記得以前在老版本中看過它。

來源

2011-01-30 15:04:39 jeroen

我已經看到我的子彈/數字在ul左側沒有足夠的填充時被截斷。嘗試添加一點，看看是否有幫助。

來源

2011-01-30 14:52:37 rcravens

不是真的。在我的情況下，有40px的填充。子彈完全位於「ol」的填充物內。我認爲它更多的是與`li`元素的一些奇怪行爲有關（我認爲他們的子彈是在實際的`li`之外渲染的）......我剛剛回答了我的問題嗎？ – mingos 2011-01-30 14:55:25

類別。查看列表樣式位置 – 2011-01-30 14:58:48

瀏覽器將默認邊距和填充添加到列表中。首先嚐試使用reset.css來刪除默認樣式，這樣您就可以在沒有意外行爲的情況下開始清潔和新鮮。搜索Eric Meyer的重置。希望能幫助到你。

來源

2011-01-30 14:57:02

CSS溢出：隱藏列表的子彈？

回答

相關問題