Click to See Complete Forum and Search --> : Table element gaps


dartiss
03-14-2006, 08:17 AM
Hi everyone,

I hope someone can help me with something that I'm finding pretty frustrating :mad:

Here's a draft of a page I'm working on:
http://www.artisswebdesign.co.uk/copyplus

You'll notice the menu, which has a border around it and a vertical line splitting each menu section, is slightly out of alignment in comparison to the tables above and below it. Yet they're all the same size. I've been told that this is because of the "border-collapse" element I'm using in my CSS.

Removing this does, indeed, correct this alignment. But it also creates an ugly gap between the TD and TABLE elements of the menu, meaning that the vertical lines, which are part of the TD element are standing away from the TABLE border.

Here's a picture of what I mean...
http://img86.imageshack.us/my.php?image=banner1cm.jpg

My CSS has a generic TABLE, TR and TD definition which sets all the borders, etc, to a zero size. The specific TABLE and TD definitions for this menu don't change this. So why the gap? Can anybody work out what I'm doing wrong?

Many thanks
David.

Fang
03-14-2006, 09:25 AM
Use cellspacing instead of border-collapse:<table class="menu" width="100%" cellspacing="0">

pcthug
03-14-2006, 08:39 PM
http://www.hotdesign.com/seybold