I got no responses to my question about whether this was a generally known
problem, so here's a specific example:
http://gavelcade.com/bordercrossing.html
My actual table has to have thin, white borders separating cells having a
background color. The table has column headers, the horizontal borders of
which I want to color and emphasize by making them heavier. Before I even
got started I wondered whether the horizontal borders would be "laid over"
the vertical borders (preferred) or vice versa. What in fact happens in IE6
and Opera is neither.
In the example, I've exaggerated the borders, making them 10 pixels and 20
pixels to highlight the problem. I set border-bottom for the TH cells in the
THEAD, and border-top for the table itself.
In IE6, the browser *compromises* at the internal, yielding an ugly effect.
Opera does this too, and also does it at the table's top border. In Mozilla
and Netscape, the horizontal borders are laid visually "over" the vertical
borders at the corners.
I just noticed that in IE, even at the top border, the vertical white
borders push 1 pixel into the table top border on the left and right sides.
If I activate a different window and then return to IE, this discrepancy is
fixed--until I refresh the page. Like the peek-a-boo bug, in that respect.
I tried a slightly different approach, setting border-bottom for the TRs
instead of for the THs inside the THEAD. In Opera, this had no effect. In
IE, the special borders disappeared altogether, as IE apparently doesn't
like applying borders to TRs.
I don't think there's a way to specify *different* behavior from what I'm
experiencing, but I thought I'd run it by all of you.
