Table borders using CSS...

liunx

Guest
Greetings!<br />
<br />
I format my pages using a common .css file.<br />
<br />
However, I am now working on a document which needs it's table formatted differently than what's in the standard .css file.<br />
<br />
The table needs to have a 1px wide black border around every element.<br />
<br />
Now, I've tried using inline styles in every td, but that's blows the code up too much, imo.<br />
<br />
So, is there any way (via span or div or something) to affect only a small portion of the code in my HTML-document with black border on every td?<br />
<br />
/Robert<!--content-->If you don't want to use document or element styles, you can surround the table with an additional table. Try this:<br />
<br />
<TABLE BGCOLOR="#000000" CELLSPACING="0" CELLPADDING="0"> <br />
<TR><TD> <br />
<TABLE CELLSPACING="1"> <br />
<TR><TD BGCOLOR="#FFFFFF">&nbsp;</TD> <br />
<TD BGCOLOR="#FFFFFF">&nbsp;</TD> <br />
</TR> <br />
</TABLE><br />
</TD></TR> <br />
</TABLE><br />
<br />
-aslefo<!--content-->Brilliant! I was so into CSS that I did not even consider that.<br />
<br />
Thanks!<br />
<br />
(I'd still like to know the way to do it with CSS though... for future reference, if not anything else...)<!--content-->you mean something like this<br />
<br />
TABLE {<br />
<br />
}<br />
TR {<br />
<br />
}<br />
TD {font-family:arial,helvetica; font-size:10pt;<br />
vertical-align:center; bgcolor: 1px;<br />
}<br />
<br />
or something similiar to that?<!--content-->Yes, but the question is where (and how) to put those CSS rules, since I only want to affect a single table on the page...<br />
<br />
And again, I don't want to use classes or anything which clutters the html code of that table (since it's such a huge table).<br />
<br />
/Robert<!--content-->if you only have 1 table on the page that is the way to go, but ify ou have more than one it will change them all as there is no way to do it without classes.<!--content-->Ok. I tried to encapsulate the whole table in a span and div, but I don't think it worked properly.<br />
<br />
Thanks for the tips anyway. I'll prolly go for the inline CSS stuff, then.<br />
<br />
/Robert<!--content-->Use a class selector:<br />
<br />
<style><br />
TD {whatever: something }<br />
TD.mascara { border : 1px solid black }<br />
</style><br />
<br />
<table><br />
<tr><br />
<td class="mascara"></td> <br />
<td class="mascara"></td><br />
</tr><br />
</table><!--content-->
 
Back
Top