[thelist] CSS: best way to format for TD's and A's

Stephen Caudill SCaudill at municode.com
Wed Aug 20 08:27:28 CDT 2003


Casey Crookston on Tuesday, August 19, 2003 4:49 PM said:

: What is the most effective way to format css code and html for a
: class to be effective with in <td> and <a> tags.
<snip /> 
: Thanks in advance.

Hi Casey,
  Doesn't look like you gotten any bites, so here's my take on 
this. I don't see where you're envoking the 'tab' class in your 
HTML, so I'll go over this with contextual selectors and with 
classes as selectors. 

First, my preffered method, contextual selectors:

 The CSS:
  table{
	font:11px normal Arial, Helvetica, sans-serif;
	color:white;
	padding:0px 0px 0px 5px;
  }
  table a{
	text-decoration:none;
	color: #0000ff;
  }
  table a:hover{
	text-decoration:underline;
  }

Probably the best way to utilize the above is by having a 
parent contextual selector.  I generally use something like
<div id="content"> for the main content of the site.  You
would modify the selectors above like so:
  
  #content table
    -or-
  div#content table

Now, with classes as selectors:

 The HTML:
  
 <table class="tab">
    <tr>
       <td>text 1</td>
       <td><a href="fubar.html">text 2</a></td>
    </tr>
 </table>

 The CSS:
  .tab{
	font:11px normal Arial, Helvetica, sans-serif;
	color:white;
	padding:0px 0px 0px 5px;
  }
  .tab a{
	text-decoration:none;
	color: #0000ff;
  }
  .tab a:hover{
	text-decoration:underline;
  }

Finally, here's the W3C reference for selectors:

<http://www.w3.org/TR/CSS2/selector.html>

It's a quick read and an invaluable reference!

hth,
Stephen Caudill
http://www.mechavox.com


More information about the thelist mailing list