Need help with div rows

Hello all,

I am having an issue with html. This might be a design issue or a technical issue I am not sure yet. What I have is a row of div tags that are generated in php with a for loop and. Each <div> tag contains an <img> tag and a <label> tag. All the <div> tags have the same id.

When the page loads it will load the <div> tags in a vertical line. The best i can do is make this a list and display it inline, but then I get a horizontal line with no wrapping.

Ultimately, what I want is rows of pictures with a label under them that will autowrap when the browser is re-sized. Nothing more, nothing less. Let's assume that I have no css and here is basic structure for the repeating div tags:

<div class="item_picmenu_item" id="item_picmenu_item">
<img src="somepic.jpg"><br>
<label>Some label</label>
</div>

Thanks in advance

Well you can lose the id attribute on the div unless each div has a different ID value.

You can achieve the affect you are going for by floating the divs. e.g.


.item_picmenu_item
{
float: left;
}


And that should cause them to auto-wrap depending on the browser width.

Some thing very similar to what you are implementing is discussed in this article: http://www.alistapart.com/articles/practicalcss/

Oh it was so simple it makes me want to cry.