Set font outside the table but inside the body

Forum Moderators: not2easy

Message Too Old, No Replies

Set font outside the table but inside the body

Willjohnh

1:54 pm on Feb 16, 2004 (gmt 0)

Hi there

I am trying to find a way to control the format of text that appears within tables, and within tables within tables

(ie -
<table><tr><td>
<table><tr><td>ddd</td></tr></table>
</td></tr></table>

without putting anything in the head or the <table><tr> or <td> tags and without having to put the <font> tag around each piece of text within the <td>'s.

"ddd" in the above is obviously the text I want to control.

I was hoping I could place the table(s) within a <div> in which I defined the font format of everything within that <div> (including the text within the table(s)) but it doesn't seem to want to play.

Can this be done and if so how? Any help greatly appreciated

Birdman

2:07 pm on Feb 16, 2004 (gmt 0)

Hello Willjohnh, and welcome to webmasterworld.com!

You said "without putting anything in the head or the <table><tr> or <td>...".

At the least, you will need to add something to the head of the doc, like a <link /> to an external stylesheet.

Your plan to wrap the table(s) within a div should be fine. That way you can control just those tables without messing with other ones elsewhere on the page.

Something like:

CSS:
#myfont table{font: 1em Verdana}

I too have been having some troubles with tables and inheritance lately, to the point where I have to define certain styles inline for them to work.

Willjohnh

2:30 pm on Feb 16, 2004 (gmt 0)

Thanks Birdman

The only problem is that I cannot define anything in the <head>. This is to do with email newsletters so things like Hotmail ignore your <head> contents and display their own.

Can I define the #id etc inline as well?

Birdman

4:51 pm on Feb 16, 2004 (gmt 0)

Okay, now I see. You may want to try adding the styles to the <div> tag inline and then see if they inherit to the <table>. If not, put the inline style in the <table> tag itself.

Willjohnh

5:22 pm on Feb 16, 2004 (gmt 0)

I can get the table to inherit the font face but not the size even if it's in the same inline style tag - so we're half way there!

eg:

<div style="font-family:arial;font-size:10pt;">

<table width="100%" border="0" cellspacing="0" cellpadding="4" style="border: solid 1px #cccccc">
<tr>
<td>Team Name</td>
<td width="100"><div align="center">Pages Created</div>
</td>
<td width="100"><div align="center">Total Raised</div>
</td>
</tr>
<tr bgcolor="white">
<td><a href="#">Team1</a></td>
<td width="100"><div align="center">1</div>
</td>
<td width="100"><div align="center">$4009.98</div>
</td>
</tr>
<tr bgcolor="lightgrey">
<td><a href="#">Team 2</a></td>
<td><div align="center">34</div>
</td>
<td><div align="center">$8399.22</div>
</td>
</tr>
</table>
</div>

Because of what I am building, I can't get to the inner table tags (our clients can add HTML within a template we set-up through an online WYSIWYG editor - so if they create a table within that editable area of the template, I want to be able to define a default font face and size)

Thanks again

Birdman

5:42 pm on Feb 16, 2004 (gmt 0)

It may not be elegant, but I'm pretty sure you can add <style> tags inside the <body>. It maybe against the standards but I've seen it in action and it worked.

So, you could go back to the original plan and define your styles inside the <body>

<body>
<style type="text/css">
#myfont table,#myfont td(font: Arial 12pt)
</style>