CSS获取浮动DIV以拉伸到窗口高度

多年来我第一次与CSS打交道，我有一种不愉快的感觉，我把自己逼到了一个角落

我用以下内容创建了一个3列浮动布局：

* {
    margin: 0;
    padding: 0;
    font-family: "Trebuchet MS", Verdana, Arial, sans-serif;
}

    #wrapper {
        width: 960px;
        background: silver;
        margin: 0 auto;
    }

#column-left {
    width: 240px;
    float: left;
    background: #f4d2d4;
    padding-top: 36px;
}

#column-center {
    margin-top: 41px;
    margin-left: 34px;
    margin-right: 34px;
    width: 492px;
    float: left;
    background: white;
}

#column-right {
    width: 160px;
    float: left;
    background: white;
    margin-top: 49px;
}

如您所见，左边的一栏有彩色背景。但它并没有延伸到页面底部，只是覆盖了内容。我需要它一直伸展下去

---

切换到绝对位置或固定位置，拧紧3列布局。使用高度：100%必须回到身体，这会把一切都搞砸。有没有一个简单的方法来解决这个问题？

将

高度：100%

添加到

主体
，
html
和您的列中。
丹·塞德霍姆有一个很好的方法，可以让它看起来像是使用“人造列”技术扩展的列。与其重新编写，不如将其链接到此处：


克里斯·科伊尔（Chris Coyier）也写了一篇很好的文章，介绍了如果你决定使用流体布局，不同的人解决这个问题的方法：

我已经试过了。它将框进一步延伸，但不会延伸到页面底部。谢谢。我以前看过《假专栏》的把戏，但我希望有一个不那么“棘手”的解决方案来解决看起来如此简单的问题。似乎奇怪的是没有。另一页看起来很方便。