在清除修復時遇到問題，無法使用960網格系統

我正在用960網格系統構建樣機，並遇到了.clearfix問題。我並不喜歡在我的代碼中添加額外的div來觸發清除，並且在所有文檔中都有.clearfix似乎是解決方案。 960gs也帶有自己的clearfix類，所以我的期望是它應該可以工作。但是，當我應用標籤什麼也沒有發生。空格中的清除類工作。雖然元素上的clearfix類我想在失敗後強制清除。鑑於有多少關於clearfix，它一定是我忽略的東西。在清除修復時遇到問題，無法使用960網格系統

這裏是源：

<html> 
<head> 
<title></title> 
<link rel="stylesheet" type="text/css" media="all" href="css/reset.css" /> 
<link rel="stylesheet" type="text/css" media="all" href="css/960.css" /> 
<link rel="stylesheet" type="text/css" media="all" href="css/text.css" /> 
<style type="text/css"> 
    div > div 
    { 
     height:3em; 
     background-color:Lime; 
    } 
</style> 
</head> 
<body> 
<div class="container_12"> 
    <div class="grid_4 clearfix"></div> 
    <div class="grid_4"></div> 
</div> 
</body> 
</html>

來源

2011-11-19 QueueHammer

我回到了這裏，想解釋我發現的解決方案和我從中學到的東西。

因此，清除修補程序將停止它們處於繼續浮動狀態的容器後的元素。這是使用float浮現的一個有趣的問題。然而，在這種情況下很容易將症狀與原因混淆。

你看到的是元素，divs，當它們不應該是「浮動」到另一個時，因爲它們在不同的容器中。假設是，這是因爲你沒有清除浮動。此外還有很多解決這個問題的方法，包括在標記中添加一個元素來「清除浮動」。這個元素通常具有「清晰：兩者」作爲風格和時期或「& nbsp」;因爲它的內容。這看起來像修復了問題，但最終成爲解決另一個問題的手段。

真正的問題是，只有浮動元素的容器最終沒有任何體積。如果您有兩個容器，一個接一個，另一個容器有浮子，看起來浮子沒有被清除，因爲兩個容器都倒塌，佈局破裂。但是，解決方案是向容器添加溢出屬性。在我的情況下，它是「溢出：汽車」。

「經典」清除修復解決方案通過添加一個沒有浮點和體積的元素來達到這個目的，因此容納所有元素的容器不會摺疊並保持某種形式的體積。然而，解決設置溢出屬性的真正問題是一個竅門。

來源

2013-07-01 14:50:19 QueueHammer

你必須在clearfix類適用於父容器這個工作。

<div class="container_12 clearfix"> 
    <div class="grid_4"></div> 
    <div class="grid_4"></div> 
</div>

來源

2011-11-19 19:30:55 Leo

這似乎沒有工作。在你的例子中，將「修復」應用於它包含的所有div？ – QueueHammer

所以我在很長一段時間後回來了。你的建議是解決方案的一半。另一半是將溢出屬性添加到container_12，以便當它包含的所有內容都是浮動時它將被賦予大小。 – QueueHammer

在清除修復時遇到問題，無法使用960網格系統

回答

相關問題