CSS 动态垂直高度

Question

我正在为我的网站设计新布局，我希望用户能够更改 View 。一个 View 是静态的 540 像素高且水平/垂直居中。第二个不再垂直居中，并允许内容定义高度。

它目前使用第一个选项，但在第二个选项中，实用程序列(2011 年浏览器使用统计)不会填满整个高度。有解决办法吗？

不知道你要多少源码。我在下面列出了指向我的网站的链接以及 CSS 代码中的差异。

My Website

第一个选项(目前有效):

#floater {
    margin-bottom: -27em; /* vertical center - half of container's height */
    height: 50%; /* vertical center */
}
#wrapper {
    height: 54em; /* vertical center */
}
#content {
    height: 33em; /* static height */
}

第二个选项(无效):

#floater {
    margin-bottom: 0em; /* vertical top */
    height: auto; /* vertical top */
}
#wrapper {
    height: auto; /* vertical 100% */
}
#content {
    height: 100%; /* dynamic height */
}

Answer 1

考虑你在做什么和你在说什么:

#content {
    height: 100%; /* dynamic height */
}

but in the second option, the utility column (2011 Browsers Usage Stats) does not fill the entire height

你只能选择一个。你想让它填满整个高度还是动态的？