我的div不會正確對齊。爲什麼？

這個網頁在Dreamweaver中看起來不錯，但是當我在任何瀏覽器中查看它時，3列不在wrapper2 id內。它甚至沒有出現。我無法弄清楚爲什麼。我的div不會正確對齊。爲什麼？

這是我的HTML代碼

<body> 
    <div id="wrapper"> 
     <div id="header"> 
      <div id="menu"></div> 
     </div> 
     <div id="wrapper2"> 
      <div id="leftpane"></div> 
      <div id="bodycontent"></div> 
      <div id="rightpane"></div> 
     </div> 
     <div id="footer"></div> 
    </div> 
</body>

這裏是CSS

#wrapper { 
    width: 900px; 
    background-color: #666; 
    margin-right: auto; 
    margin-left: auto; 
} 
#wrapper #header #menu { 
    background-color: #00F; 
    height: 50px; 
    width: 900px; 
    position: relative; 
    top: 150px; 
} 
#wrapper #header { 
    background-image: url(../images/index_03.gif); 
    height: 200px; 
    width: 900px; 
} 
#wrapper2 { 
    position:relative; 
    width:900px; 
    background-color:#999; 
    height:auto; 
} 
#leftpane { 
    width:200px; 
    height:347px; 
    background-color:#C96; 
    left:0px; 
    top:0px; 
    margin:5px; 
    float:left; 
} 
#rightpane { 
    width:200px; 
    height:347px; 
    background-color:#C96; 
    margin:5px; 
    float:right; 

} 
#bodycontent { 
    width:400px; 
    margin:5px; 
    height:347px; 
    background-color:#C96; 
    float:left; 
} 
#footer { 
    width:900px; 
    height:80px; 
    background-color:#0C6; 
}

請有人可以幫我在這？

來源

2012-02-05 guitarlass

你可以請設置演示@ http://jsfiddle.net？ – PeeHaa 2012-02-05 14:28:20

http://jsfiddle.net/mayRY/ - 除非我錯過了一些東西，它實際上看起來不錯。 – 2012-02-05 14:31:10

@PeeHaa我[已添加]（http://jsfiddle.net/E7yBJ/1/） - 問題看起來像'height：auto;'不適用於浮動元素 - 請參閱我的示例中的設置到固定的高度，它看起來很好.. – 2012-02-05 14:31:46

從外觀上看，你並沒有清理浮動的#wrapper2元素。嘗試清除包裝如下：

#wrapper2:before, #wrapper2:after { 
    content:""; 
    display:table; 
    zoom:1; /* ie fix */ 
} 

#wrapper2:after { 
    clear:both; 
}

來源

2012-02-05 14:35:18

謝謝... Andres Ilich它的工作，:) – guitarlass 2012-02-08 14:18:52

@guitarlass偉大的，如果答案清除了你的問題，請考慮接受它，除了答案使用複選標記。這樣可以幫助未來的用戶解決同樣的問題。 – 2012-02-17 14:25:20

嘿找不到它.. – guitarlass 2012-02-18 04:50:40

我的div不會正確對齊。爲什麼？

回答

相關問題