寬度爲25％的四個節點不適合彼此相鄰？

我有一個頭節點，其中有四個子節點。沒有邊框，填充或邊距。所有四個人的寬度：25％; css規則。在Opera中，它工作得很好，在IE中，最後一個塊有時會根據窗口的寬度翻轉到下一行。寬度爲25％的四個節點不適合彼此相鄰？

我可以通過給出一個24.8％的寬度來解決它，但Opera將其解釋爲24％，因此在塊的末尾留下1％的廣闊空白。

我該如何解決這個問題？最後一個塊錯過右側的一個像素就可以了。

來源

2008-12-08 Boris Callens

您可能需要根據瀏覽器加載不同的樣式表。你可以在頭文件中使用一些JavaScript來做到這一點。

來源

2008-12-08 21:43:11

我覺得這是一個悲傷的趨勢，網站開始需要JS的微不足道的事情。儘管我可以有條件地加載它們。這確實是一個解決方案。不是最好的，但可以作爲最後的手段。 – 2008-12-08 21:46:38

它取決於使用的舍入算法。如果你有多個像素可以被4整除，那麼你就不會有問題，因爲沒有舍入問題。如果你沒有這個，那麼有時候你會因爲像素的寬度過大而導致像素過多。

total width: 800 
25% width: 200 
four 25% blocks: 800

total width: 799 
25% width: 199.75 
four side-by-side blocks: either 796 or 800

800針對799寬度窗口寬度是要降下來了。

來源

2008-12-08 21:44:00

百分比的整體概念是流體佈局。因此，封閉我的寬度會使百分比變得多餘。 – 2008-12-08 21:47:25

http://ejohn.org/blog/sub-pixel-problems-in-css/

這是在CSS世界著名的問題，很遺憾。可能的問題是，這些適合的100％像素等價值是一個奇數，所以計算像素時會出現舍入誤差。

通常我通過使用IE特定的選擇器來解決這個問題。 Rob建議使用特定於瀏覽器的樣式表，但我總是發現難以維護的行爲，並且需要來自瀏覽器的額外HTTP負載。我也討厭CSS hacks，但是你可以在聲明合適的寬度（例如width：25％; #width：24.9％;）後嘗試着名的#width：24.9％。希望如果IE在未來的版本中修復了這個黑客攻擊，它也會伴隨四捨五入的問題。另外，如果你知道父元素的像素寬度，你可以確保它可以被4整除。但是如果這是一個流體佈局，那不是一個選項。

來源

2008-12-08 21:47:34 user37731

謝謝，我確實發現了一些記錄問題的材料。而且它似乎還沒有真正的解決方案呢：s 另外，Opera忽略小數百分比這一事實使得它更難。我喜歡我的歌劇，但這真的很糟糕。 – 2008-12-08 22:38:07

寬度爲25％的四個節點不適合彼此相鄰？

回答

相關問題