DOCTYPE affecting table borders

Forum Moderators: open

Message Too Old, No Replies

DOCTYPE affecting table borders

seems to make side borders disappear or get thinner

MatthewHSE

7:06 pm on Jul 21, 2003 (gmt 0)

I've never used DOCTYPE before, but today I decided it's about time I did. So I put a strict doctype declaration in one of my pages, worked out a few small problems, and now I am pleased with the results.

Except . . .

I've got one table with the following properties:

Before I put in the doctype, the border displayed fine. Now, however, it looks like the side borders between cells has been eliminated. Why might that be? (I tried changing the doctype to transitional, but that didn't help either.)

Thanks,

Matthew

Nick_W

7:10 pm on Jul 21, 2003 (gmt 0)

Hmm... Not sure on the reason but here's the solution ;)


.myTableClass {
  border: 1px solid #000000;
  padding: 0;
  margin: 0;
}

If you're going strict you gotta go CSS ;)

Nick

MatthewHSE

7:17 pm on Jul 21, 2003 (gmt 0)

Hey Nick, thanks for the answer. I'll try that soon.

I'm using CSS as much as possible for everything but positioning. But, the border attribute is not deprecated, according to the w3c list of deprecated tags. Is there another reason I shouldn't use it?

Nick_W

7:26 pm on Jul 21, 2003 (gmt 0)

Well, it's more in the 'spirit' of seperation of style and content and, one more step for you in that illuminating journey from <shudder> table based layouts to full html/css ;-)

It came as a bit of a surprise to me to tell the truth that XHTML strict dtds allowed it but I'd still go the CSS route personally...

Nick

MatthewHSE

7:31 pm on Jul 21, 2003 (gmt 0)

Think I will, too. No real reason not to. ;-)

pageoneresults

7:40 pm on Jul 21, 2003 (gmt 0)

table, td{border-collapse:collapse;}

That should take of the border issue.

g1smd

8:45 pm on Jul 21, 2003 (gmt 0)

You should also export the CSS to an external file and call it with instructions in the <head> section of the HTML file. Most people use this one, but it can cause problems:

<link type="text/css" rel="stylesheet" src="/path/file.css">

It is better to use this slightly longer version of this, again placed in the <head> section of the HTML file:

<meta http-equiv="Content-Style-Type" content="text/css">

This version hides the CSS from older versions of Netscape that cannot handle CSS. This stops those versions from displaying a corrupted page with overlapping elements.