问题标签 [equal-heights]

我有一个响应式布局，为此我需要一些高度相等的 div，它们会在调整大小时自动改变高度。

我用这个脚本设置相等的高度：

这是我的 HTML 结构：

但是当设置高度时，当我调整大小时它会保持这个高度，我不知道如何在调整大小时再次改变大小？

页面加载时应设置相等的高度 - 并在每次调整大小时更改。

任何人都可以帮忙吗？:)

这是我的 HTML（或访问luxury-decor.co.uk）

现在，如您所见，当这样设置时，右侧的图片库太大了。是否有可能使“包装器”内的 div 具有相同的高度？我确实遇到了这个http://www.cssnewbie.com/equalheights-jquery-plugin/#.UUBcyhw0xnM但我对 jQuery 不太好，无法让它工作。有任何想法吗？

我有一个带有 li 的 ul 菜单：

这里是 JSFiddle：http: //jsfiddle.net/uvkQp/

每行有 3 个 Top 项目 li，然后是其下的子项目，然后是 3 个 Top 项目及其下的子项目。我怎样才能让 Top 项目 li 的高度每次都是均匀的（其中包含最多子项目的最大高度）。

HTML：

CSS：

http://www.indigoeastend.com/live-entertainment.html

我有一个上面列出的页面，其中有手风琴框，打开时会破坏布局。特别是最后一个。我使用以下脚本使列相等：

当盒子被打破时，我怎样才能让两列都调整大小。我正在尝试使用innerheight，但这不起作用。有人有什么想法吗？

请检查这个小提琴：

我想要以下内容：红色栏有一些文字，黄色是动态内容，绿色什么都没有，只是一种颜色。我希望红色和绿色列都与黄色内容一样高。height: 100%没用

我正在尝试显示两个高度设置为主体宽度 3 的 div，如果 div 需要更多空间来匹配彼此，则匹配这些高度。像等高的列。

这是我到目前为止所拥有的：

这可以完美地获得宽度并设置为高度，我尝试过使用相等高度的片段，但还没有任何效果。

如果有人有任何建议，我很乐意听取他们的意见。

对于我正在处理的应用程序，我需要等高的列。我选择使用 CSS 将我的列项设置为表格的样式。这样每列的高度确实是列高中的最大值。

在此处查看示例：http: //jsfiddle.net/roelvd/GXe9m/

现在每列的高度在每个浏览器中确实是 100%。然而，直接在每一列中的元素（在我的例子中是 .container）也应该是 100%。这在 Firefox 和 Chrome 中都可以正常工作；但在 IE10 中没有（很可能是较旧的 ID 版本）。

HTML：

CSS：

所以我第一次使用相等的高度，我成功地让子 div (#sidebar) 与父 div (#Content) 的高度相匹配。但是，每个页面上都添加了额外的空间。内容越多，垂直滚动越长，页面底部的空白区域就会更大。我正在使用我开发的自定义 Wordpress 主题，所以问题可能出在某个地方。我目前使用的代码如下：

<script type="text/javascript"> $(function(){ $('#Content').equalHeights(); }); </script>

这是该网站的链接：http: //fentonauto.com/web/category/sales/

提前感谢您提供的任何指导！

目前我正在使用负边距技术（例如CSS - Equal Height Columns?）使我的水平 div 看起来具有相同的高度。这在一段时间内效果很好，但现在我必须为 div 添加边框，但由于填充和负边距的组合来拉伸背景，因此没有底部边框。

这是我用我的代码设置的小提琴：http: //jsfiddle.net/BvVKH/3/

HTML：

相关CSS：

我查看了许多不同的解决方案，我最初选择这个的原因是因为它支持旧的 IE。是否有更多纯 CSS 选项可以在所有浏览器中实现与边框相同的高度？

Hey so I found this sweet jquery snippet by CSS-tricks Chris Coyier that resets div elements heights that share the same top position on the page (are on the same row) to the tallest element.

The Problem This solution almost works with fluid width layouts and resets height when top positions changes but it resets it to the original height of the current tallest element in the row when the page first loaded. This is an issue because the height of the tallest element might have changed since this page first loaded because of the use of relative units like ems or because of word wrapping with paragraphs. Proposed Solution The solution would be to have the row's elements' height being set to the tallest element's current height, not the original height. I have been unsuccessful in accomplishing this.

Here is the snippet where "li.half" is the elements being compared and resized.

Please let me know if you can figure out how to make the setConformingHeight adjust on window resize.

Thanks!