Question

JSFiddle here

var element=$("#outer"); // element is a jQuery object
var max=0;
element.children().each(function(index, child) {
    child=$(child);
    var childPos=child.position();
    var childMax=childPos.top+child.outerHeight();
    if(childMax>max) {
        max=childMax;
    }
});
element.css({height: max+'px'});

任何人都可以在没有给出修复高度的情况下向#outer div添加边框吗？：/

我尝试使用jquery但它不起作用。如果可能，请向我提供任何工作示例。

Answer 1

好像你试图将box2内容的边框放在实际上是溢出的（这意味着它的高度属性不会反映其内容的高度）。

将CSS更改为height:auto：

#box1, #box2 {
    width: 20px;
    height: auto;
    background: #f00;
}

然后更改每个选择器：

element.find('*').each( function(index, child) { 
    //... 
});

因此，您在迭代中获得了元素box2，因为它不是outer的直接子元素。

Working Fiddle

更新：替代解决方案

如果你想保留原来编写的CSS，你可以找到DOM元素的scrollHeight，并在溢出的情况下用它来确定里面内容的高度。 / p>

更改此行：

var childMax=childPos.top+child.outerHeight();

对此：

var childMax=childPos.top+child[0].scrollHeight;

Alternative Solution Fiddle

Answer 2

我在这里添加了一个边框：

#outer {
left: 50px;
top: 50px;
width: 200px;
background: #aaa;
border:1px solid red;
}

它现在有边界。你想要实现什么？也许你希望它有一个边框，并包含它的所有子元素？

绝对div的高度

2 个答案: