CSS柱結構

我正在開發一個新的模板想我的手在一些CSS3和HTML5技術...CSS柱結構

有一個小問題......當我檢查用Firebug這個頁面，我可以看到我的LEF列和右列沒有被裝入#container div。我意識到我正在浮動他們都離開...但不知道我需要做什麼才能讓他們包裝在集裝箱分區....

這是HTML：（鏈接到頁面的情況下，比較容易）http://www.bcidaho.com/dev-acn/index.asp

<body> 

    <div id="container"> 

    <!--#include file="_includes/top-nav-header.asp"--> 

    <!--#include file="_includes/home-nav.asp"--> 


     <div id="left-col"> 
      <p>Lef Nav Column</p> 
     </div><!-- End #left-col --> 

     <div id="main-col"> 
      <p>Main Column</p> 
     </div><!-- End #main-col --> 


    </div> <!--! end of #container --> 

    <!--#include file="_includes/footer.asp"--> 
</body>

CSS位置爲：（沒有想拋出一噸的CSS的這個帖子上對不起）http://www.bcidaho.com/dev-acn/css/style.css

來源

2011-07-07 tony noriega

他們正在incased。在螢火蟲中，它看起來並不像它，因爲它們的浮標沒有被清除。添加到您的CSS：

.clear { 
    clear:both; 
}

後：

<div id="left-col"> 
      <p>Lef Nav Column</p> 
     </div><!-- End #left-col --> 

     <div id="main-col"> 
      <p>Main Column</p> 
     </div><!-- End #main-col --> 
<div class="clear"></div>

應該這樣做。

來源

2011-07-07 15:59:59 brenjt

適用overflow:hidden爲「容器」

來源

2011-07-07 16:01:30 superjaz1

添加overflow: hidden;，overflow: auto;，或float: left;到的div＃集裝箱

來源

2011-07-07 16:03:42

如果我添加：浮動：左;殺死佈局並將容器推開......但我仍然看到你的觀點。 –

@tony這就是爲什麼我說「或」。有多種解決方案。 –

回答

相關問題