HTML / CSS:使包装器扩展以适合其子级的高度

时间:2013-07-25 11:44:13

标签: html css

我正在建立一个网站。所有内容都存储在包装器DIV中。内容DIV具有分配给它的边框样式。

我希望包装器DIV的高度足够高以适应它的内容,因此边框会到达页面的末尾。

我认为默认会发生这种情况,因为height:auto是所有元素的默认值。

这是我的page

感谢您提供任何帮助。

4 个答案:

答案 0 :(得分:2)

制作包装div样式

overflow: auto

答案 1 :(得分:1)

html {
  height: 100%;
}

body {
  /* not height: 100%; otherwise you're 
   * fixing it to the height of the viewport 
   */
  min-height: 100%; 
}

.wrapper {
  /* some kind of clearfix is 
   * necessary because your content 
   * is floated
   */
  overflow: hidden;
}

答案 2 :(得分:0)

如果我理解正确你想要创建一个全高度的网站?

如果有,请尝试sticky footer

答案 3 :(得分:0)

只需使用div来嵌套内容,“不要”给它任何高度。默认情况下,它适合它的孩子。如有必要,您可以提供display: block

这是小提琴http://jsfiddle.net/8bP9b/