Can CSS div height 100% with liquid parents work?
So if the parent div's height is 100% then you can set the child to 100% and it will work. But if the parent's height is decided by content then the height attribute doesn't seem to work.
Is there a decent workaround that would work on most browsers?
<html>
<head>
<style>
#content img
{
display: block;
}
#left
{
float: left;
}
#right
{
开发者_如何学Go float: left;
width: 200px;
border: thin solid;
height: 100%;
}
</style>
</head>
<body>
<div id="content">
<div id="left">
<img src="images/dc_logo.png"/>
<img src="images/dc_logo.png"/>
<img src="images/dc_logo.png"/>
</div>
<div id="right">
stretch full height plz
</div>
</div>
</body>
</html>
No, there isn't, and it's a shame. There are little tricks to emulate the effect, but those are situational. For example, if you have a sidebar and a main content area, you can surround them in a container, and give the container a background the repeats vertically to look like it's the sidebar. Or you can use JavaScript to dynamically calculate the size onload. But unfortunately, purely CSS-wise you're stuck.
精彩评论