divs in the same row, but filling the row

[Francesco Moi]

Hi.

I want to place 5 divs within the same row:
div-div-div-div-div

My HTML:
-------------
<div class="content">
<div class="fooclass"><img src="image.jpg"></div>
<div class="fooclass"><img src="image.jpg"></div>
<div class="fooclass"><img src="image.jpg"></div>
<div class="fooclass"><img src="image.jpg"></div>
<div class="fooclass"><img src="image.jpg"></div>
<div class="fooclass"><img src="image.jpg"></div>
</div>
--------------

My CSS:
--------
div.fooclass
{
float:left;
background-color:red;
}
--------

However, the divs are really floating, and I went them to fill their
row, because I have to insert <br/> to fill this row.

Does anybody have a solution? Thank you very much.

 

[John Hosking]

I want to place 5 divs within the same row:
div-div-div-div-div

<div class="fooclass"><img src="image.jpg"></div>
<div class="fooclass"><img src="image.jpg"></div>
<div class="fooclass"><img src="image.jpg"></div>
<div class="fooclass"><img src="image.jpg"></div>
<div class="fooclass"><img src="image.jpg"></div>
<div class="fooclass"><img src="image.jpg"></div>

div.fooclass
{
float:left;
background-color:red;

display:inline;
/*presumably you have some padding and margins, too*/

}

However, the divs are really floating, and I went them to fill their
row, because I have to insert <br/> to fill this row.

It won't always be five, but might be three or six, depending on the
width of the container (viewport). But that's what you really want,
isn't it?

HTH