CSS父DIV溢出

我有一個網站的問題，我放在一起。我有一個簡單的div佈局。主要內容如下：CSS父DIV溢出

<body> 
    <div id="Container"> 
     <div id="Logo"></div> 

     <div id="Banner"> 
      <div id="Nav"></div> 
     </div> 
     <div id="Content"> 
     </div> 

     <div id="footer">Footer</div> 
    </div> 
</body>

我的CSS如下：

@charset "utf-8"; 
/* CSS Document */ 


html, body { 
    height:100%; 
    padding:0; 
    margin:0; 
    background-image:url(../layout.img/background_gradient.gif); 
    background-repeat:repeat-x; 
} 

#Container { 
    height:100%; 
    width:950px; 
    margin:auto; 

    background-color:#FFFFFF; 
    border-left:1px solid #333333; 
    border-right:1px solid #333333; 
} 

#Logo { 
    width:160px; 
    height:160px; 
    float:right; 
} 

#Banner { 
    width:100%; 
    height:160px; 
} 

#Nav { 
    width:550px; 
    height:33px; 
    position:relative; 
    top:100px; 
    left:50px; 
} 

#Content { 
    clear:both; 
}

最後的結果可以在這裏看到：

http://jsfiddle.net/mczMS/

正如你可以看到'容器'的div沒有伸展與內容，當你向下滾動頁。我知道這可能是愚蠢簡單的事情，但我今天缺乏腦力。哈哈。

來源

2009-11-19 Ben

嘗試增加：

#container { min-height: 100%; }

後高100％。您也可以嘗試：

#container { overflow: auto; }

來源

2009-11-19 03:58:15 cletus

不錯！工作很好。感謝那！ – Ben

如果從容器中移除高度：100％，它將拉伸以適合其內容。

來源

2009-11-19 03:59:41 Deeksy

但是，如果高度低於全高，我認爲高度是100％。 – cletus

CSS父DIV溢出

回答

相關問題