Html 具有内容溢出容器的div

我有一个

好的，所以我确实设法解决了这个问题，但解决方案是一个包含JavaScript的两部分交易

首先，我使用一些自定义JavaScript来计算.grid_内容元素的适当高度，粘贴在这里以供参考。该解决方案不适用于其他项目，但应说明思考过程

function resizeContentElements() {
    $('div.grid_content').each(function(i, element){
        var $element = $(element);

        var parentHeight = $element.parent().height();
        var elementPadding = parseFloat($element.css('padding-top')) + parseFloat($element.css('padding-bottom'));
        var siblingSpace = $element.prev().height() + parseFloat($element.prev().css('padding-top')) + parseFloat($element.prev().css('padding-bottom'));

        $element.height(parentHeight - siblingSpace - elementPadding);
    });
}

---

之后，我抓取它并将其应用于div.grid_元素集合。每件事都得到了省略号，尽管内容被省略号截断的点似乎并不那么均匀。我最好的猜测是，这些容器中的不规则（通常是无效的）标记会弄乱它。

用来做一个小的工作示例。据我所知，除了框布局（CSS3）之外，目前没有唯一的CSS方法根据元素的同级高度限制元素的高度。目标平台是什么？盒子布局可行吗？还是你也需要瞄准IE7/8？我担心的不是兄弟姐妹，但我只是不希望它占据比容器中更多的高度。兄弟姐妹之间唯一相关的一点是，他们也占用了空间。在中，边距：10px会有任何影响，因为它是绝对定位的吗？谢谢你发布你的答案，确保你能接受它。