包含2個浮動div的div

需要您的幫助。我創建了一個包含2個浮動DIV的div。第一個Div將是leftnav。第二個Div也包含2個浮動DIV。問題#container div高度設置爲自動，但似乎沒有工作。包含2個浮動div的div

我想清楚：無論是在第二個div結束，但沒有奏效。

任何幫助，將不勝感激。謝謝

<div id="header">header</div> 
<div id="container"> 
    <div id="first">first</div> 

    <div id="second"> 
     <div id="scol1"> 
      <div id="scol1a">scol1a</div> 
      <div id="scol1b">scol1b</div> 
      <div id="scol1c">scol1c</div> 
     </div> 
     <div id="scol2"> 
      <div id="scol2a">scol2a</div> 
      <div id="scol2b">scol2b</div> 
      <div id="scol2c">scol2c</div> 
     </div> 
    </div><!--SECOND DIV--> 

    <br style="clear: both;" /> 

</div> <!--CONTAINER DIV--> 
<div id="footer">footer</div>

來源

2013-04-01 s4m

更改scol1高度爲auto以及。 http://jsfiddle.net/Y47sx/31/

來源

2013-04-01 09:42:52 btevfik

，一個是快速的，謝謝你，它的工作，但它仍然浮動DIV脫落方面曾高度變得比容器div的高度。我試圖讓容器div伸展一旦浮動div內部變得更大。 – s4m

@ user2074014你可以把一個小提琴的例子爲 – btevfik

我做了更改，但頁腳受到影響，並沒有線索如何解決它。 [jsfiddle]（http://jsfiddle.net/seaamx/Y47sx/40/） – s4m

-1

在<br style="clear: both;" />使用<div style="clear:both; float:none;"></div>立場和刪除的<div id="scol1"></div> <div id="scol2"></div>

來源

2013-04-01 09:44:45

謝謝，但容器div仍然不能拉伸。 – s4m

高度你給100px的高度scol1a，scol1b，scol1c。這導致容器有問題。爲了解決這個問題，你應該定義你的#containerheight: 306px;（100 + 100 + 100 + 6）= 306px。 6px爲邊界。看到這個Demo

注：我已刪除<br style="clear: both;" />

來源

2013-04-01 12:00:23

我做了更改，但頁腳已受到影響，不知道如何解決該問題。 [jsfiddle]（http://jsfiddle.net/seaamx/Y47sx/40/） – s4m

正如我之前描述你的容器導致高度標識問題，所以你必須定義容器的高度因爲你已經在容器中定義了高度。看到你的更新[小提琴]（http://jsfiddle.net/Y47sx/46/） – 2013-04-02 01:36:44

包含2個浮動div的div

回答

相關問題