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

Question

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

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

请注意:侧栏保持FLUID"溢出:自动"参数.

Answer 1

平等高度列有几种技术,我通常喜欢Alex Robinson关于Position Everything的这个技巧:

怎么样？

基本方法的工作方式如下:

1. 作为列的块必须包装在容器元素中
2. 应用overflow:隐藏到容器元素
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>