清除浮動沒有顯示屬性

Question

我知道清理浮動的舊學校方法是明確的類：兩者，並且它一般已經過時。

我知道新的學校方法是寬度：100％;溢出：自動或隱藏;

但是，當我的內容動態擴展超出父容器的邊界時，我無法使用新的學校方法。在這種情況下，有沒有比明確更好的方法：兩者？

Answer 1

她是對的，我在努力鞏固發佈了一箇舊的線程，但根據HTML5的樣板，這是事實上的clearfix現在：

http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demystified/

.clearfix:before, .clearfix:after { 
    content: "\0020"; display: block; height: 0; visibility: hidden; 
} 

.clearfix:after { clear: both; } 
.clearfix { zoom: 1; } 

我們使用<br>清除這裏，所以我對新的學校風格不感興趣。抱歉。

Answer 2

有兩種「新學校」的方法。一個是溢出，另一個是clearfix。

新學校＃1：

#el { 
    overflow:hidden; 
    zoom:1; 
} 

的任何東西，但visible溢出值創建這將導致一個新的塊格式化上下文浮被自動清除。

新校＃2：

#el:after { 
    content:""; 
    clear:both; 
    display:block; 
} 
#el { zoom:1; } 

的clearfix基本上產生一個可見的空白字符「元件」是塊級和元件之後清除的區域。這是一個CSS替代插入一個空白的div，爲你清除。

如果您需要超出邊界的元素，請使用＃2。否則，請使用＃1。 zoom觸發hasLayout，並導致el在IE7之前包含浮點數。 IE7 +瞭解overflow:hidden。

編輯：正如Grillz指出的，content: "\0020";實際上是clearfix最新的最新屬性值，如果你走這條路線。有一個渲染錯誤發生在空白處，可以通過指定而不是週期，空字符串或空格字符串來解決。