Listing products CSS question

[yukimushu]

Hi,

I'm currently working on an eCommerce website and am wondering what the best way to list the products is in css.

The products displayed in a list down the center of the page, one after another, with an image, some descriptive text and price etc; I'm wondering whether it's best to put them in a styled list, or within one div after another?

Example:

<div class"product">
product 1 information
</div>
<div class"product">
product 2 information
</div>

or

<ul>
<li>product 1 information</li>
<li>product 2 information</li>
</ul>

[holmescreek]

I like the div method seems to be easier to left float text, images, prices etc.

[crankin]

Using the list is best practice, as you will be using html to describe the content. This makes your page more accessible.

[richtestani]

Like crankin said, you want to describe your page.

Div are general purpose block elements, while list items are just that a list of items. Which are also block elements. You can output the exact same thing using the list method as you can with divs.

<li class="product first">Product 1 </li>

Because list items are block level elements you can put almost anything inside them.

[yukimushu]

Using the list is best practice, as you will be using html to describe the content. This makes your page more accessible.

Excellent; this was my pattern of thought.

The term "product list" made me think it would be best practice to put it in an unordered list!

I'll do that tonight then, thanks for the help everyone!

[Dr John]

On the other hand

The products displayed in a list down the center of the page, one after another, with an image, some descriptive text and price etc; I'm wondering whether it's best to put them in a styled list, or within one div after another?

as we have a set of data about an item, a tables seems okay to me.

Some people are so paranoid about using a table, scared stiff they will be labelled unclean and non-standard, that they forget that a table is for tabulating data. And this is a data set about the items. (Bet it comes from a table in a database too)

The div method is actually trying to recreate a table without using a table. (and without the cells either).

Tables are not evil, if used for what they were originally intended.
And a table is designed to list items and their attributes.