It works perfectly in Opera. Safari and Chrome show the content about 10px above the title. Firefox shows the content about 10px below the title.
How would I fix this so that all browsers show the text lined up?
html
CODE
<div id="content">
<table border="0" align="center" width="890px">
<tr>
<td rowspan="2" width="90px"></td>
<td width="291px" valign="top">
<div id="title">TITLE<br />GOES<br />HERE<br /></div>
</td>
<td rowspan="3" width="419px" style="padding-top:0px" valign="top">
<div class="p">blah blah blah text text information blah blah blah text text information blah blah blah text text information<br /><br /></div>
<div class="p">blah blah blah text text information blah blah blah text text information blah blah blah text text information<br /><br /></div>
</td>
</tr>
<tr>
<td>
<div id="subtitle"><em>subheader below the title goes here</em></div>
</td>
</tr>
<tr>
<td>
</td>
</tr>
</table>
</div>
css
CODE
#title {
font-family:helvetica, sans-serif;
font-size:45pt;
color:#303030;
text-shadow:1px 1px 1px #ffffff;
font-weight:bold;
}
#subtitle {
font-size:18pt;
font-family:times new roman, serif;
color:#606060;
}
.p {
font-family:helvetica, sans-serif;
color:#303030;
}
Answers