My page, coded in Dreamweaver MX, works perfectly in IE but is mangled in Firefox. Tables don’t extend all the way, causing the hairline borders to be cut short. And my main links are not vertically aligned. See attached pictures for screenshots.
<html>
<head>
<!-- TemplateBeginEditable name="doctitle" -->
<title>Untitled Document</title>
<!-- TemplateEndEditable -->
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<!-- TemplateBeginEditable name="head" -->
<!-- TemplateEndEditable -->
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a*.indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a*;}}
}
//-->
</script>
</head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="50%" height="100%" rowspan="5" background="../images/bg.gif"> </td>
<td width="10" height="100%" rowspan="5" background="../images/shadow_left.gif"><img src="../images/spacer.gif" width="10" height="10"></td>
<td width="375" height="55" bgcolor="#A7C294"><img src="../images/logo.gif" width="375" height="55"></td>
<td width="120" height="55" bgcolor="#A7C294"><img src="../images/battles_off.gif" width="120" height="55"></td>
<td width="122" height="55" bgcolor="#A7C294"><img src="../images/divider.gif" width="1" height="55"><img src="../images/designers_off.gif" width="120" height="55"><img src="../images/divider.gif" width="1" height="55"></td>
<td width="120" height="55" align="right" bgcolor="#A7C294"><img src="../images/forum_off.gif" width="121" height="55"></td>
<td width="10" height="100%" rowspan="5" background="../images/shadow_right.gif"><img src="../images/spacer.gif" width="10" height="10"></td>
<td width="50%" height="100%" rowspan="5" background="../images/bg.gif"> </td>
</tr>
<tr>
<td height="20" colspan="4" background="../images/yellow_bar.gif" bgcolor="#FFB10D"><img src="../images/spacer.gif" width="20" height="20"></td>
</tr>
<tr>
<td height="100%" colspan="4">
<table width="738" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="20" height="20" background="../images/edge_left.gif"><img src="../images/spacer.gif" width="20" height="20"></td>
<td width="100%" height="20"><img src="../images/spacer.gif" width="20" height="20"></td>
<td width="20" height="20" background="../images/edge_right.gif"><img src="../images/spacer.gif" width="20" height="20"></td>
</tr>
<tr>
<td width="20" height="100%" background="../images/edge_left.gif"><img src="../images/spacer.gif" width="20" height="20"></td>
<td width="100%" height="100%" valign="top"><img src="../images/spacer.gif" width="100" height="100"></td>
<td width="20" height="100%" background="../images/edge_right.gif"><img src="../images/spacer.gif" width="20" height="20"></td>
</tr>
<tr>
<td width="20" height="20" background="../images/edge_left.gif"><img src="../images/spacer.gif" width="20" height="20"></td>
<td width="100%" height="20"><img src="../images/spacer.gif" width="20" height="20"></td>
<td width="20" height="20" background="../images/edge_right.gif"><img src="../images/spacer.gif" width="20" height="20"></td>
</tr>
</table></td>
</tr>
<tr>
<td height="20" colspan="4" background="../images/yellow_bar.gif" bgcolor="#FFB10D"><img src="../images/spacer.gif" width="738" height="20"></td>
</tr>
<tr>
<td height="30" colspan="4" background="../images/copyright.gif" bgcolor="#A7C294"><img src="../images/spacer.gif" width="738" height="30"></td>
</tr>
</table>
</body>
</html>
