Hello everybody,
today I was working on a web site when I found a strange effect.
Take the following html document:
----begin----
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html;
charset=ISO-8859-1">
<title>Some title</title>
<STYLE type="text/css">
body
{
background: #FFFFFF;
font-family: sans-serif;
font-size: 75%;
color: #ff7030;
}
p
{
font-family: sans-serif;
color: #000000;
margin-top: 30px;
}
</STYLE>
</head>
<body>
<h1><a name="Header1">Some Header</a></h1>
<p>This is some paragraph</p>
<table border="0" cellpadding="10" cellspacing="0"
width="600">
<tbody>
<tr>
<td valign="top" width="30%"><font
color="blue"><b>blue</b></font></td>
<td valign="top">Explanation for blue</td>
</tr>
<tr>
<td valign="top"><font color="black"><b>black</b></font></td>
<td valign="top">Explanation for black</td>
</tr>
</tbody>
</table>
---end----
When you look at this you will see that the "paragraphed" text is
black and small as it should be since black is defined in the p css
part and 75% is defined in the body css part. The values in the 2.
column of the table are orange as they should be from the body css
part, but ... why is the text in the table larger than the text in the
preceding paragraph????
It looks like the table text gets it's colour from the body
definition but not the font size. I don't get this? Why is this so? Has
anybody an idea? IE6 and FF1.5 show the same behaviour.
Regards,
Frank