Jump to content

[SOLVED] Container DIV (holding floated DIVs): Fixing the height.


Goldeneye

Recommended Posts

I've got a DIV that holds two left-floated DIVs which has a height of zero. This has always kind of bothered me when holding floated DIVs inside a container DIV, so I tried fixing it with a clear: both; property on the .wrapmessage class but it didn't work. Yes I scoured Google for a solution and found a few that didn't seem to work. So does anyone know how to fix this problem (give the container DIV the height of the bigger (height-wise) DIV.)?

 

I hope I made it clear enough..

 

A preemptive thanks, anyways.

 

<html>
<head>
	<title>FooBar</title>
	<style type="text/css">
		div.wrapmessage {clear: both; border: 1px solid red;}
		div.messageinfo {float: left; width: 100px; border: 1px solid green;}
		div.messagebody {float: left; width: 200px; border: 1px solid blue;}
	</style>
</head>
<body>
	<div class="wrapmessage">
		<div class="messageinfo">LEFT DIV - FOOBAR</div>
		<div class="messagebody">RIGHT DIV - FOOBAR</div>
	</div>
</body>
</html>

I don't really understand most of what you were trying to say, but reading this:

 

So does anyone know how to fix this problem (give the container DIV the height of the bigger (height-wise) DIV.)?

 

I think you may want to give the containing div the following css attribute:

 

overflow: auto;

 

And if you have the height set to zero, get rid of that.

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.