Hey.
Topic says it all basically.
I have one div ID that should be centered with a fixed width but no height as I want the height to be relative to its inner content. The inner divs share the same class and should float next to each other but once I give them the float:left attribute the CSS reacts weird and all following layers within that page align very odd. I added a border to see what's happening, see that the borderline does not outline the inner content like it should. If I give the outer DIV a fixed height things work like they should but I need it to be relative and not fixed in height.
Here's the code:
Thanks for any help!
Topic says it all basically.
I have one div ID that should be centered with a fixed width but no height as I want the height to be relative to its inner content. The inner divs share the same class and should float next to each other but once I give them the float:left attribute the CSS reacts weird and all following layers within that page align very odd. I added a border to see what's happening, see that the borderline does not outline the inner content like it should. If I give the outer DIV a fixed height things work like they should but I need it to be relative and not fixed in height.
Here's the code:
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "[URL unfurl="true"]http://www.w3.org/TR/html4/loose.dtd">[/URL]
<html>
<head>
<title>CSS Test</title>
<style type="text/css">
#outer_div {
border: 1px solid;
width: 880px;
margin: 0px auto;
}
.inner_div {
text-align: left;
float: left;
margin: 5px;
border: 1px solid;
width: 200px;
}
</style>
</head>
<body>
<div id="outer_div">
<div class="inner_div">
should be floating
</div>
<div class="inner_div">
asdasdasdas<br>
asdasd<br>
asdasdasd<br>
</div>
<div class="inner_div">
asdasdasdas<br>
asdasd<br>
asdasdasd<br>
</div>
<div class="inner_div">
asdasdasdas<br>
asdasd<br>
asdasdasd<br>
</div>
</div>
</body>
</html>Thanks for any help!