CSS based product listing - need help

Use unordered list or?

[techstyled]

This should be very simple (and probably is) but I'm having a difficult time with it.

I need a CSS based product listing similar to an image gallery where there is a product thumbnail, product name, and then a brief blurb about the product.

I need several of these listed one after another in a "liquid layout".

At first I was trying a container DIV and then a DIV around each element but all the examples I'm seeing are using a containing DIV and then an UL with display: inline on the LI.

Yea, the whole post about the "css/html is for babies"... I think it depends on what world you come from because I can write entire backend database systems but can't "CSS" my way out of a paper bag...

TIA

EDIT: Wow, googled for basic css image gallery and, voila! I'd still appreciate any tips, comments.

div.img
{
 margin: 2px;
 border: 1px solid #0000ff;
 height: auto;
 width: auto;
 float: left;
 text-align: center;
}
div.img img
{
 display: inline;
 margin: 3px;
 border: 1px solid #ffffff;
}
div.img a:hover img {border: 1px solid #0000ff;}
div.desc
{
 text-align: center;
 font-weight: normal;
 width: 120px;
 margin: 2px;
}

<div class="img">
 <a target="_blank" href="klematis_big.htm"><img src="klematis_small.jpg" alt="Klematis" width="110" height="90" /></a>
 <div class="desc">Add a description of the image here</div>
</div>
<div class="img">
 <a target="_blank" href="klematis2_big.htm"><img src="klematis2_small.jpg" alt="Klematis" width="110" height="90" /></a>
 <div class="desc">Add a description of the image here</div>
</div>
<div class="img">
 <a target="_blank" href="klematis3_big.htm"><img src="klematis3_small.jpg" alt="Klematis" width="110" height="90" /></a>
 <div class="desc">Add a description of the image here</div>
</div>
<div class="img">
 <a target="_blank" href="klematis4_big.htm"><img src="klematis4_small.jpg" alt="Klematis" width="110" height="90" /></a>
 <div class="desc">Add a description of the image here</div>
</div>

[penders]

Yeah, I'd certainly go with an unordered list for this. Simply using display:inline; on the list-items won't sort it as you will need to float them.

A similar thread from a while back could be modified to include your 'description'. Read down to post #11 of the following thread:
[webmasterworld.com...]

[techstyled]

I had abandoned this idea because it wasn't working and I had to move on but now I'm revisiting it.

I've tried to make this work via CSS but the problem is, each product listing has:

Product Image
Product Name
Product Description (brief _variable_ length paragraph)

The problem is, what I want is:

Product1 Product2 Product3 Product4
Product5 Product6

What I wind up with if Product1 is long and Product2 is short is the second "row" jumping underneath Product2 and continuing on (and various other weirdness).

I'll try to post an example in just a bit.