2011-08-25 74 views
2

表現不同這裏的網站,我在4個編碼瀏覽器的截圖:http://img801.imageshack.us/img801/2510/browsersj.jpgCSS3列在不同的瀏覽器

有CSS3列(在IE中,有一個jQuery插件模擬CSS3列的行爲)。正如你所看到的,Opera和Firefox使第一列相對於其他列略微下降。這是第一段的餘量。 Chrome會忽略第一段的邊距並正確對齊所有內容。

我發現這個CSS規則有助於消除這個問題:

.column-3 > *:first-child { margin-top: 0; } 

不過,我覺得這有點哈克(什麼?如果我想的第一個元素保留在某些特定情況下的保證金) 。你是否碰巧知道這個問題的其他解決方案(最好是一些乾淨可靠的東西,比如box-sizing屬性在不同瀏覽器中處理不同的默認盒子模型)?

[編輯]

好吧,我發現在Firefox中,這個問題是一個overflow:hidden;集的div容器。刪除它解決了這個問題。

不過,Opera不會合作。

按@凱爾的要求,這裏的代碼重現該問題在Opera:如果http://jsfiddle.net/LVqtD/1/

+0

我們可以看到HTML標記嗎? – Kyle

回答