CSS floating div question
-
Hi there, I have a div in which I'd like to have a couple of floating divs. My problem is, the outer div has a border. But the border does not wrap around the floating divs inside. What am I doing wrong? a simple example:
box 1
box 2
box 3
.outer {border:solid 1px #000;} .inner {float:left; width:50px;} Can anyone help? Please note that I do not want to specify a width for the outer div, since it should fill whatever it is placed in. Thanks in advance! Matthias /matthias I love deadlines. I like the whooshing sound they make as they fly by. [Douglas Adams]
-
Hi there, I have a div in which I'd like to have a couple of floating divs. My problem is, the outer div has a border. But the border does not wrap around the floating divs inside. What am I doing wrong? a simple example:
box 1
box 2
box 3
.outer {border:solid 1px #000;} .inner {float:left; width:50px;} Can anyone help? Please note that I do not want to specify a width for the outer div, since it should fill whatever it is placed in. Thanks in advance! Matthias /matthias I love deadlines. I like the whooshing sound they make as they fly by. [Douglas Adams]
As the outer element doesn't have any non-floating elements in it, there is nothing that gives it height. Add a
<div class="Clear"></div>
as the last element in the outer div. Add a style:.Clear { clear: both; height: 0; overflow: hidden; }
--- "Anything that is in the world when you're born is normal and ordinary and is just a natural part of the way the world works. Anything that's invented between when you're fifteen and thirty-five is new and exciting and revolutionary and you can probably get a career in it. Anything invented after you're thirty-five is against the natural order of things." -- Douglas Adams