How to put the height of a div that contains other with absolute position?
How to put the height of a div that contains other with absolute position?
<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&l开发者_如何学运维t;br/>
</div>
</div>
</div>
</body>
</html>
The height of the div class "a" is zero
An absolutely positioned element does not take up any space in the layout, meaning that <div class='a'> won't expand to wrap it.
The only way you could possibly do this is to measure the height of .c via javascript and then set height of .a explicitly -- the downside, of course, is requiring javascript to do so.
Depending on where you are trying to position .c you may want to consider using a float instead, which CAN be wrapped.
it will not matter if you give DIV B a height smaller than DIV C , because DIV C can over lap its container.
sorry if I didn't get the question right
A <div> or any other block-container will automatically grow vertically according to the content, but once you position:absolute any <div>, you are removing it from its parent content and no longer makes its parent expands.
You might want to try to float the <div class="c"> instead of absolutely position it. That way the div will continue to be part of its parent content, though you would have to set the <div class="a"> to overflow:auto in order to make it expand on floated elements.
加载中,请稍侯......
精彩评论