Php 如何使我的侧边栏的高度和主要内容保持一致？

目前我的网站正在使用wordpress。我的侧边栏和主要内容区域的高度不对齐。如何使侧边栏的高度与主要内容保持一致？示例pageA的内容较长，但侧边栏较短，因此未使用的侧边栏区域将填满空白

下面是我的index.php代码

<?php get_header(); ?>
  <div id="table">
      <div id="mainsidebar">
          <?php get_sidebar(); ?>
      </div>
      <div id="maincontent">
          <div valign="top">
            <?php wowslider(9); ?>
          </div>
          <div valign="bottom">
            <?php include('main-content.php'); ?>
          </div>
      </div>
  </div>
<?php get_footer(); ?>
</body>

这里是我上传的示例图像链接

---

谢谢。

如果您不介意使用javascript：

$(function(){
    var main = $('#maincontent').height(),
        sidebar = $('#mainsidebar').height();
    if(main > sidebar){
        $('#mainsidebar').css({'min-height':main});
    }
});

我用这个。超级简单的设置和工程幻想

将

和

放在另一个div中。使该div与

main content

div的高度相同，并为

main边栏

div指定

高度：100%

来自的想法。

如前所述，您可以使用CSS执行此操作：

.container {
    overflow: hidden;
}
.column {
    float: left;
    margin: 20px;
    background-color: grey;
    padding-bottom: 1000px;
    margin-bottom: -1000px;
}

HTML:

---

你不需要让它保持同样的高度。 将桌面背景设置为“白色”，看起来两者的高度相同

#table {background: #fff;}

---

答案可以在这篇文章中找到：@Pey，我知道这是一个迟来的回复，但我发现这对我目前正在进行的一个项目很有用，因为CSS解决方案是不可能的。这需要进入一个外部的.js文件并链接到站点的页脚中，或者将其包装在

[code here]

标记中并放置在页脚中

<div id="table">
    <div id="mainsidebar">
        <p>Main Sidebar Content</p>
    </div>
    <div id="maincontent">
        <p>Main Content</p>
    </div>
</div>​

#table { position: relative; }

#mainsidebar { /* shorter column */
    position: absolute;
    top: 0; bottom: 0; left: 0;
    width: 38%;
    padding: 2%;
}
#maincontent { /* taller column */
    margin: 0 0 0 42%;
    width: 58%;
}​

#table {background: #fff;}