Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > centering things within a table

Reply
Thread Tools

centering things within a table

 
 
laredotornado@zipmail.com
Guest
Posts: n/a
 
      11-15-2007
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
 
Reply With Quote
 
 
 
 
dorayme
Guest
Posts: n/a
 
      11-15-2007
In article
<(E-Mail Removed)
m>,
"(E-Mail Removed)" <(E-Mail Removed)> 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
 
Reply With Quote
 
 
 
 
laredotornado@zipmail.com
Guest
Posts: n/a
 
      11-16-2007
On Nov 15, 5:43 pm, dorayme <(E-Mail Removed)> wrote:
> In article
> <(E-Mail Removed)
> m>,
>
> "(E-Mail Removed)" <(E-Mail Removed)> 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
 
Reply With Quote
 
dorayme
Guest
Posts: n/a
 
      11-16-2007
In article
<(E-Mail Removed)
m>,
"(E-Mail Removed)" <(E-Mail Removed)> wrote:

> On Nov 15, 5:43 pm, dorayme <(E-Mail Removed)> wrote:
> > In article
> > <(E-Mail Removed)
> > m>,
> >
> > "(E-Mail Removed)" <(E-Mail Removed)> 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
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
centering div within a div Steve Richter ASP .Net 4 07-16-2007 11:27 PM
vs2005 publish website doing bad things, bad things =?Utf-8?B?V2lsbGlhbSBTdWxsaXZhbg==?= ASP .Net 1 10-25-2006 06:18 PM
Centering a table Joshua Beall HTML 16 04-24-2004 09:59 AM
Centering ValidationSummary in a cell of a table NWx ASP .Net 1 02-11-2004 06:22 PM
Horizontal and vertical centering of a table Tomas HTML 3 10-31-2003 10:14 AM



Advertisments