Table border colors?

[Kenny L]

Is there a way to alter a table's border color?

[GCT13]

Table within a table. Border style is controlled from the top line. Here you'll get a 3 pixel red border:


<table cellspacing="0" cellpadding="3" border="0" width="200" bgcolor="#ff0000">
<tr>
<td>
<table cellspacing="0" cellpadding="10" border="0" width="200" bgcolor="#ffffff">
<tr>
<td>
<br /><br /><br />
</td>
</tr>
</table>
</td>
</tr>
</table>

[r2d2]

CSS.

You can apply a different border to each side of each <td> and the <table>. Will post an example later if you like, in a rush not tho..

[chromate]

Take one cell of your table and do something like this:

<td style="border: 1 1 1 1 solid black"> stuff </td>

That will give all the borders of your table cell a 1 pixel soild black border. OR...

<td style="border-left: 1px solid black; border-right: 1px dotted green;"> stuff </td>

You can figure out what that one will do. :)

[r2d2]

Thanks chromate :)

First example should really be:

<td style="border:1px solid black">stuff</td>

:)

w3schools has a good description of borders in the CSS section - a resource i use regularly.

[chromate]

Yeah, I just wanted to illustrate how you could do:

<td style="border: 1 10 3 4 solid black;"> stuff </td>

... to make each border of the cell a different size, depending on what number is changed. Saves having to write: border-left: 2px solid black; border-right: 4px solid black etc etc

just a short-cut time saver type thing.

[Kenny L]

Great! Thanks so much, guys-I thought it would be something involving CSS, I'm just learninghow it all works. Thanks again.

[GCT13]

That's pretty nice (although I can't get chromate's example to work in all browsers). I'll check out w3school's css section..

[r2d2]

You should always put a unit like "px", "%" or "em", unless its a 0, when the unit doesnt matter. That might be the stumbling block. It wouldnt know whether it was 1%, 1px, 1em or what so might just set it to 0.

[chromate]

It defaults to 1px. But technically you're right. My examples aren't "valid". They're for lazy people ;)

[r2d2]

Originally posted by chromate
It defaults to 1px. But technically you're right. My examples aren't "valid". They're for lazy people ;)

Ah ok, is that for all browsers though? I know IE does, but thought his problem must be due to this, as all the rest is valid CSS.

[Apollo]

Multiple embedded tables used to cause serious loading problems in netscape but no-one seems to use netscape anymore so I don't even check it now (after it giving me serious headaches just a few years ago).

[chromate]

I check sites to make sure they're "readable" in netscape, but don't bother much beyond that. Unless it's a client's site, in which case I'll put in a bit more effort :)

[Kenny L]

Still having problems-there's a layout grid, which is also a table, so when I can get a border on the table, I get it on the grid also. I read that I should apply a class to the CSS, but am clueless on how to do that. Also the separations for the cells also need borders. When making any adjustment to the <td> tag, (or any CSS element), should that be done in the head section or in the tags in the html?