SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Zealot yukimushu's Avatar
    Join Date
    Feb 2005
    Location
    United Kingdom
    Posts
    183
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Listing products CSS question

    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:

    Code CSS:
    <div class"product">
    product 1 information
    </div>
    <div class"product">
    product 2 information
    </div>

    or

    Code CSS:
    <ul>
    <li>product 1 information</li>
    <li>product 2 information</li>
    </ul>

  2. #2
    SitePoint Wizard holmescreek's Avatar
    Join Date
    Mar 2001
    Location
    Northwest Florida
    Posts
    1,707
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I like the div method seems to be easier to left float text, images, prices etc.
    intragenesis, llc professional web & graphic design

  3. #3
    SitePoint Enthusiast
    Join Date
    Apr 2002
    Posts
    74
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Using the list is best practice, as you will be using html to describe the content. This makes your page more accessible.

  4. #4
    SitePoint Addict richtestani's Avatar
    Join Date
    Nov 2003
    Location
    Bridgeport
    Posts
    292
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    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.

    Code:
    <li class="product first">Product 1 </li>
    Because list items are block level elements you can put almost anything inside them.
    RichTestani
    -------------------------------
    http://www.junkdepot.com
    http://www.rareoopdvds.com | The Movie Poster Site

  5. #5
    SitePoint Zealot yukimushu's Avatar
    Join Date
    Feb 2005
    Location
    United Kingdom
    Posts
    183
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by crankin View Post
    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!

  6. #6
    SitePoint Wizard
    Join Date
    Jul 2003
    Location
    Kent
    Posts
    1,921
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    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.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •