css - 侧边栏的高度等于主要内容

Question

我在这里编辑一个 wordpress 主题。我的侧边栏高度有问题。

如何使右侧边栏与主要内容一样高？

请注意：侧边栏通过“溢出：自动”参数保持 FLUID。

Answer 1

等高列有几种技术，我通常喜欢Alex Robinson在Position Everything上的这个：

如何？

基本方法是这样工作的：

1. 将充当列的块必须包装在容器元素中
2. 应用溢出：隐藏到容器元素
3. 将padding-bottom: $big_value应用于列块，其中 $big_value 是一个足够大的值，以保证它等于或大于最高列
4. 将margin-bottom: -$big_value应用于列块

CSS 看起来像这样：

 #block_1, #block_2, #block_3 {
     padding-bottom: 32767px;
     margin-bottom: -32767px;
 }

 #wrapper {
     overflow: hidden;
 }

和 HTML：

<div id="wrapper">
    <div id="block_1">
        <p>Content goes here</p>
    </div>
    <div id="block_2">
        <p>Content goes here</p>
    </div>
    <div id="block_3">
        <p>Content goes here</p>
    </div>
</div>