I'm trying to design a image archive where a number of "images" are retrived from a db. Now I want to display a number of images on the same "line". Say that the result from the DB was 6 images, when the images are displayed only 3 can fit on a line, so the next 3 would be displayed under the other 3 on a line. I can get this to work decent with the float property like below exampel. How ever the "footer" div is displayed after the number 6 div. Why would this be? I have boxed in the 6 float divs within a "container" div. Shouldnt I get a "line" break after the container end tag?
<div class="MASTER CONTAINER">
<div>Headline</div>
<div>
<div style="float: left;">Image code</div>
<div style="float: left;">Image code</div>
<div style="float: left;">Image code</div>
<div style="float: left;">Image code</div>
<div style="float: left;">Image code</div>
<div style="float: left;">Image code</div>
</div>
<div>Footer</div>
</div>