UBB.Developers Forums Community Development Programming HTML, CSS, and JavaScript Table Borders

Table borders annoy me very easily. Simply because they're so awkward to handle.

Here's the deal: I've got two tables right next to each other. The lower table collapses/uncollapses when a link in the upper table is clicked.

Collapsed:


Uncollapsed:


The problem is, I know that when two tables are shoved right next to each other, there's a horrible thick line where they meet (because there are really two borders there, not one). I'd like to make the top and bottom borders of the collapsing table invisible, so that when the tables are collapsed/uncollapsed, they look like this:

Collapsed:


Uncollapsed:


I'm 100% certain it can be done with CSS (most of that site is actually CSS-driven, and soon it will be totally CSS-driven), so is there anyone willing to put the final piece in the jigsaw and help me solve this small problem?

Thanks in advance

(The page I\'m working on, in case you need to see the HTML)

you took the page away

Just set the 'border-top' and 'border-bottom' attributes on the tables so that there is not a border on those sides when the table is collapsed.

i.e. border-top: 0px;

I didn't take the page away, Allen, but the server that's hosted on is extremely unstable. It's the best I've got at the moment though, cause my host suspended my account again.

I'll try that tonight, Steven... Thanks

Talk about unstable, I got to the link, it loads half the page, then BAM! It says page cannot be displayed.

http://www.w3.org/TR/CSS2/propidx.html