I Need Borders Around Each Cell

[myrrh]

The code I am using the table is this:

<table style="border:2px solid #00000" width="320" align="center" bgcolor="0044DD">

This gives me a border around the outside of the table but not the cells. How do I make this table have cell borders as well as the whole table?

[chirp]

table { 
 border-collapse: collapse; 
 border: 2px solid #666; 
} 
td { 
 border: 1px solid #ccc; 
}

;)

[myrrh]

Thanks, chirp - how do I use that as in-line style?

[rocknbil]

Why would you want to?

If you only want it on certain cells, use a class:

td.bordered { border: 1px solid #ccc; }

<td class="bordered">....

Then if you change it later, you only change the style sheet.

But if you must, <sigh> :-)

<table>
<tr><td>no border</td><td style="border:1px solid #ccc;">bordered</td></tr>
</table>

Just like your table sample.

[myrrh]

Perhaps my terminology is not accurate (Please realize you're dealing with one who knows little about CSS). What I meant by "in-line" was I want to apply style to only one table on the document. In-line as opposed to external or embedded.

Is my understandind correct that what chirp wrote is to be used externally or in the head of the document? And if it is used in the head the style would apply to all tables on the document?

[Fotiman]

Perhaps my terminology is not accurate (Please realize you're dealing with one who knows little about CSS). What I meant by "in-line" was I want to apply style to only one table on the document. In-line as opposed to external or embedded.

Yes, your terminology was wrong. :)

Is my understandind correct that what chirp wrote is to be used externally or in the head of the document? And if it is used in the head the style would apply to all tables on the document?

Correct.

To apply it to only 1 table in the document, give your table an ID or class value:

<table class='cars'>
<tr>
<td>
Ford
</td>
<td>
Toyota
</td>
</tr>
</table>

Then in the head of your document:

<style type="text/css">
.cars td { border: 1px solid #ccc; }
</style>

If you only want the style to apply to certain table cells, then also apply a class to your td's:

<table class='cars'>
<tr>
<td class='domestic'>
Ford
</td>
<td class='foreign'>
Toyota
</td>
</tr>
</table>

<style type="text/css">
.cars td.foreign { border: 1px solid #ccc; }
</style>

Hope that helps.