Chris
Chris

Reputation: 1939

Formatting the text in a table with CSS

I need some basic css help. I attempted to style the cells of a table using a css stylesheet, but its not working

The code of the table is:

<table> 
<tr><td><p style="font-size:13px"><a href="mailto:[email protected]">XXX&nbsp;&nbsp;&nbsp;</a></p></td><td><p style="font-size:13px">XXXX&nbsp;&nbsp;&nbsp;</p></td><td><p style="font-size:13px">XXXXXXX   </p></td></tr> 
   <tr><td><p style="font-size:13px"><a href="mailto:[email protected]">XXX&nbsp;&nbsp;&nbsp;</a></p></td><td><p style="font-size:13px">XXXX&nbsp;&nbsp;&nbsp;</p></td><td><p style="font-size:13px">XXXXXXX   </p></td></tr> 
    <tr><td><p style="font-size:13px"><a href="mailto:[email protected]">XXX&nbsp;&nbsp;&nbsp;</a></p></td><td><p style="font-size:13px">XXXX&nbsp;&nbsp;&nbsp;</p></td><td><p style="font-size:13px">XXXXXXX   </p></td></tr> 
     <tr><td><p style="font-size:13px"><a href="mailto:[email protected]">XXX&nbsp;&nbsp;&nbsp;</a></p></td><td><p style="font-size:13px">XXXX&nbsp;&nbsp;&nbsp;</p></td><td><p style="font-size:13px">XXXXXXX   </p></td></tr> 
      <tr><td><p style="font-size:13px"><a href="mailto:[email protected]">XXX&nbsp;&nbsp;&nbsp;</a></p></td><td><p style="font-size:13px">XXXX&nbsp;&nbsp;&nbsp;</p></td><td><p style="font-size:13px">XXXXXXX   </p></td></tr> 
       <tr><td><p style="font-size:13px"><a href="mailto:[email protected]">XXX&nbsp;&nbsp;&nbsp;</a></p></td><td><p style="font-size:13px">XXXX&nbsp;&nbsp;&nbsp;</p></td><td><p style="font-size:13px">XXXXXXX   </p></td></tr> 
        <tr><td><p style="font-size:13px"><a href="mailto:[email protected]">XXX&nbsp;&nbsp;&nbsp;</a></p></td><td><p style="font-size:13px">XXXX&nbsp;&nbsp;&nbsp;</p></td><td><p style="font-size:13px">XXXXXXX   </p></td></tr> 
         <tr><td><p style="font-size:13px"><a href="mailto:[email protected]">XXX&nbsp;&nbsp;&nbsp;</a></p></td><td><p style="font-size:13px">XXXX&nbsp;&nbsp;&nbsp;</p></td><td><p style="font-size:13px">XXXXXXX   </p></td></tr> 
                  </table>

The only way I got the text to not go to browser defaults was to explicitly state it on every single cell, which seems like a waste of load time (as miniscule as it is). Is there a way to set the size of the text for the entire table? It's is all the same size.

I tried putting the table inside a <p> and then styling it using a CSS class, but it was not working. Not sure if it matters, but I am using XHTML 1.0.

Upvotes: 13

Views: 89733

Answers (3)

ZyteX
ZyteX

Reputation: 239

Change <table> to <table style="font-size: 13px;">. That should change all of the text inside of the table.

Otherwise, you can just add a class or id to it and use it to style the rows as said by @user1086498.

Upvotes: 0

user1086498
user1086498

Reputation:

I would add the class to the table:

<table class='myFormat'><tr>....</tr></table>

Then:

table.myFormat tr td { font-size: 13px; }

Can you tell me what browsers this is in?

Upvotes: 20

Kummer Wolfe
Kummer Wolfe

Reputation: 603

Have you tried:

td { font-size: 13px }

OR

td.myfontsize { font-size: 13px ; }

then using:

class="myfontsize" 

applied to your td tags?

Upvotes: 6

Related Questions