Question

如何将包含其他的div的高度放在绝对位置？

<html>
<head>
<style type="text/css">
.a{

}
.b{
position:relative;
}
.c{
position:absolute;
}
</style>
</head>

<body>

<div class="a">
<div class="b">
<div class="c">
   ESTO ES LO QUE CONTIENE EL DIV<br/>
   ESTO ES LO QUE CONTIENE EL DIV<br/>
   ESTO ES LO QUE CONTIENE EL DIV<br/>
   ESTO ES LO QUE CONTIENE EL DIV<br/>
</div>
</div>
</div>


</body>

</html>

div类“a”的高度为零

Answer 1

绝对定位的元素不占用布局中的任何空间，这意味着<div class='a'>不会扩展以包裹它。

你可能做到这一点的唯一方法是通过javascript测量.c的高度，然后明确地设置.a的高度 - 当然，缺点是需要javascript这样做。

根据您尝试定位.c的位置，您可能需要考虑使用浮动，而不是可以包裹。

Answer 2

如果你给DIV B一个小于DIV C的高度就没关系，因为DIV C可以超过它的容器。

抱歉，如果我没有得到正确的问题

Answer 3

<div>或任何其他块容器会根据内容自动垂直增长，但只要position:absolute任何<div>，您就会将其从其父内容中删除，而不再使其父级扩展。

您可能想尝试浮动<div class="c">而不是绝对定位它。这样，div将继续作为其父内容的一部分，但您必须将<div class="a">设置为overflow:auto才能使其扩展浮动元素。

如何将包含其他的div的高度放在绝对位置？

3 个答案: