centering things within a table

Discussion in 'HTML' started by laredotornado@zipmail.com, Nov 15, 2007.

  1. Guest

    Hi,

    I'm having trouble centering the vertical bars ("|") between the words
    in the nav at the top of this page

    http://dhlovelife.com/v2/cart/products_main.php

    The HTML code is below

    <table class="orderProc" width="100%" cellpadding="0" cellspacing="0"
    border="0">
    <tr>
    <td align="center"><a href="#" class="categoriesNav">Goods Home</a></
    td>
    <td align="center" class="categoriesNav"> | </td>
    <td align="center"><a class="categoriesNav" href="https://
    dhlovelife.com/v2/cart/products.php?SubCategoriesID=2">Everyday
    Essentials</a></td>
    <td align="center" class="categoriesNav"> | </td>
    <td align="center"><a class="categoriesNav" href="https://
    dhlovelife.com/v2/cart/products.php?SubCategoriesID=3">Kids and Pets</
    a></td>
    <td align="center" class="categoriesNav"> | </td>
    <td align="center"><a class="categoriesNav" href="https://
    dhlovelife.com/v2/cart/products.php?SubCategoriesID=4">Holiday</a></
    td>
    <td align="center" class="categoriesNav"> | </td>
    <td align="center"><a class="categoriesNav" href="https://
    dhlovelife.com/v2/cart/products.php?SubCategoriesID=5">Fantasy Play
    Things</a></td>
    </tr>
    </table>

    Any help would be greatly appreciated. Thanks, - Dave
    , Nov 15, 2007
    #1
    1. Advertising

  2. dorayme Guest

    In article
    <
    m>,
    "" <> wrote:

    > I'm having trouble centering the vertical bars ("|") between the words
    > in the nav at the top of this page


    You could simply *not* put each link into a separate cell, (if
    you are determined to use tables). Something like:

    <td><link> | <link> | <link> | <link> | <link></td>

    would be simpler, no? Style the thing then for color of
    foreground and background.

    As a stepping stone to not use tables at all for laying out such
    things. There is a modern movement around these parts that frowns
    on using tables for anything but tabular data.

    Google up for horizontal css lists when you have time.

    --
    dorayme
    dorayme, Nov 15, 2007
    #2
    1. Advertising

  3. Guest

    On Nov 15, 5:43 pm, dorayme <> wrote:
    > In article
    > <
    > m>,
    >
    > "" <> wrote:
    > > I'm having trouble centering the vertical bars ("|") between the words
    > > in the nav at the top of this page

    >
    > You could simply *not* put each link into a separate cell, (if
    > you are determined to use tables). Something like:
    >
    > <td><link> | <link> | <link> | <link> | <link></td>
    >
    > would be simpler, no? Style the thing then for color of
    > foreground and background.
    >
    > As a stepping stone to not use tables at all for laying out such
    > things. There is a modern movement around these parts that frowns
    > on using tables for anything but tabular data.
    >
    > Google up for horizontal css lists when you have time.
    >
    > --
    > dorayme


    I like your idea of eliminating the table cells and having everything
    in just one row, but when I do this, the words and horizontal bar
    don't space themselves out to take up the entire width of the row.
    How can I get them to spread out?

    Thanks, - Dave
    , Nov 16, 2007
    #3
  4. dorayme Guest

    In article
    <
    m>,
    "" <> wrote:

    > On Nov 15, 5:43 pm, dorayme <> wrote:
    > > In article
    > > <
    > > m>,
    > >
    > > "" <> wrote:
    > > > I'm having trouble centering the vertical bars ("|") between the words
    > > > in the nav at the top of this page

    > >
    > > You could simply *not* put each link into a separate cell, (if
    > > you are determined to use tables). Something like:
    > >
    > > <td><link> | <link> | <link> | <link> | <link></td>
    > >
    > > would be simpler, no? Style the thing then for color of
    > > foreground and background.
    > >
    > > As a stepping stone to not use tables at all for laying out such
    > > things. There is a modern movement around these parts that frowns
    > > on using tables for anything but tabular data.
    > >
    > > Google up for horizontal css lists when you have time.
    > >
    > > --
    > > dorayme

    >
    > I like your idea of eliminating the table cells and having everything
    > in just one row, but when I do this, the words and horizontal bar
    > don't space themselves out to take up the entire width of the row.
    > How can I get them to spread out?
    >
    > Thanks, - Dave


    Here is something I knocked up for you quickly. There is no big
    need given your material to get the menu to spread out over a 24"
    screen. In most good browsers, max width works and I suggest
    1000px for your page as a rough figure. I have kept your table
    for the 4 boxes but thrown out most of your code. You really must
    not do this table within table and lots of span stuff, you will
    just get lost.

    If you really want, you can just have the horizontal menu as a
    table cell (you can float things inside the cell to solve your
    desire to spread things out but I have no time to go though this
    at the moment). I have given you a taste for a horizontal list
    for it. Compare the actual html you have, in complexity, with
    this:

    http://tinyurl.com/24ovl7

    You will need to configue it more to suit yourself.

    The best exercise next is to be rid of the table altogether for
    the 4 boxes. Not so hard to do. But enough for now...

    O and reminder, for this sort of thing it might be an idea to
    prepare the "good" pics to be the same total size, if evenness is
    what you are after.

    --
    dorayme
    dorayme, Nov 16, 2007
    #4
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. NWx
    Replies:
    1
    Views:
    325
    Ivan Demkovitch
    Feb 11, 2004
  2. Tomas
    Replies:
    3
    Views:
    775
    Tomas
    Oct 31, 2003
  3. Joshua Beall

    Centering a table

    Joshua Beall, Apr 23, 2004, in forum: HTML
    Replies:
    16
    Views:
    699
    spaghetti
    Apr 24, 2004
  4. =?Utf-8?B?V2lsbGlhbSBTdWxsaXZhbg==?=

    vs2005 publish website doing bad things, bad things

    =?Utf-8?B?V2lsbGlhbSBTdWxsaXZhbg==?=, Oct 25, 2006, in forum: ASP .Net
    Replies:
    1
    Views:
    585
    =?Utf-8?B?UGV0ZXIgQnJvbWJlcmcgW0MjIE1WUF0=?=
    Oct 25, 2006
  5. Steve Richter

    centering div within a div

    Steve Richter, Jul 16, 2007, in forum: ASP .Net
    Replies:
    4
    Views:
    465
    Brandon Gano
    Jul 17, 2007
Loading...

Share This Page