jquery - 无法让子 div 匹配其父列或合作伙伴列的可变高度

Question

我会尝试对帖子进行格式化以使其易于访问:

• 问题:

我在尝试让一列 div(边栏)与其父列或其左侧的列的高度相匹配时遇到了一些令人沮丧的事情。我已经尝试通过纯 CSS 然后通过 jQuery 来完成它，但到目前为止还没有找到解决办法。页面内的内容是内容管理的(Wordpress + Boostrap)，基础本身用作其他三个页面的模板，因此固定高度的解决方案在这里不会真正有用。

还有我上次尝试的 jQuery 尝试的残余，来自 StackOverflow 上另一个非常相似的问题的解决方案。这没有成功，但我将代码留在了(父 div 上的 colh-parent，两个子列上的 colh-child 和标题中的 jQuery)中，以防它帮助任何人理解我想要实现的目标。

我还尝试了一种涉及 float 父容器和子容器的方法，但似乎也没有任何效果。我目前经验不足，这个问题似乎有点难以理解。

• 相关页面:

http://okamistudio.com/ssawp/pennants/

• 目标:

我试图让蓝色边条与白页的底部相接，就像在这个页面中一样(尽管在那个页面中它被内容强制向下):

http://okamistudio.com/ssawp/about-us/

我想要实现的是侧边栏 (div.subpage-sidebar) 的蓝色背景与白色 strip 的底部相接。据我了解，这将要求其父项 (div.span3) 满足其合作伙伴列 (div.span6) 或父项 (div.row/.colh-parent) 的高度。

Answer 1

您可以使用侧边栏的绝对定位来解决这个问题。也许不是最理想的依赖，但我已经测试过它，它看起来和你想要的完全一样。

.colh-parent {
    position: relative;
}
.span3 {
    position: absolute;
    right: 0;
    height: 100%;
}