HTML tables question.

[Kharn]

Hi guys,
It's been a while since I have had to do anything in HTML with tables and I am a little rusty essentially what I am after is a way to make the outline of the table coloured so it fits in with the basic style of the rest of the site.
Cheers, Chris.

 

[Baez]

<table border="2" bordercolor="#000088">

or

<table border="2" bordercolorlight="#0000bb" bordercolordark="#000077">

 

[Kharn]

Thanks, Chris it's been so long since I did anything in HTML.

 

[Baez]

Yeah no problem mate. I only know it because it's still mandatory in my college.

 

[NightSurge]

Yeah no problem mate. I only know it because it's still mandatory in my college.

HTML is mandatory? Weird... I know enough HTML to get by from doing web editing and such, but I've never learned how to do a web page from scratch with it. I usually grab a template and I just know how to edit things where I need them.

 

[Baez]

Yep the course is called INT222 taken in the 2nd semester of 8. Purely XHTML.

 

[CrazeD]

Using the borders like that, in my opinion, looks crappy and doesn't look the same on all browsers.

Here is another approach that I think looks a lot better.

<style type="text/css">
.table-border { background:#ff0000; }
.row { background:#000;color:#fff; }
</style>

<table border="0" cellspacing="0" cellpadding="0" width="500px">
<tr><td class="table-border">
<table border="0" cellspacing="1" cellpadding="2" width="100%">
<tr>
<td class="row">table data here</td>
<td class="row">more stuff here</td>
</tr>
</table>
</td></tr>
</table>

.table-border is, as you probably guessed, the table border color. In my example it is red.

.row is the background of the cells. In my example it is black, with white text. In this method, you have to set the background color of each cell because otherwise it will be the same color as the border color. But, it looks better and is consistent on other browsers.

EDIT: Also, the 'cellspacing="1"' on the second table controls the width of the border in px.

 

[oldskool]

Craze,

Is that an internal CSS ? Just curious, because I dont see a link to an external.

 

[CrazeD]

<style type="text/css">
.table-border { background:#ff0000; }
.row { background:#000;color:#fff; }
</style>

Did you miss this part?

Yes it's internal.

 

[oldskool]

Well actually I am new to CSS in my current class, and I was too lazy to go look at the text book. But thanks