PDA

View Full Version : Table Layout IE vs. Firefox


bobrugh
04-22-2010, 12:05 PM
768

769
Having some spacing issues in Internet Explorer. I've attached above a page in IE and the same page in Firefox. The vertical rule should be centered between the left navigation and the center content. Any solutions. Using tables and don't really want to scrap the whole thing for something new at this point. The site was created on a mac. The code is as follows:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Robert F. Rugh Photographs</title>
<style type="text/css">
<!--
body {
text-align : center ;
min-width : 800px ;
}
a:link {
color: #000000;
text-decoration: none;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
}
a:visited {
color: #000000;
text-decoration: none;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
}
a:hover {
color: #999999;
text-decoration: none;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
}
a:active {
color: #000000;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
text-decoration: none;
}
div.wrapper {
width : 800px ;
text-align : left ;
margin-left : auto ;
margin-right : auto ;
}
.style1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #000000;
text-decoration: none;
font-weight: bold;
text-align: left;
}
.style1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #000000;
text-decoration: none;
font-weight: bold;
text-align: left;
}
.style3 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8px;
font-weight: normal;
}
.style2 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 2px;
}

-->
</style>
<script src="../Scripts/AC_RunActiveContent.js" type="text/javascript"></script>

<script type="text/javascript" src="swfobject.js"></script>

<script type="text/javascript">
swfobject.registerObject("myId", "9.0.115", "expressInstall.swf");
</script>

<link href="untitled.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div class="wrapper">

<table width="800" height="600" border="1" cellpadding="0" cellspacing="0">
<!--DWLayoutDefaultTable-->
<tr>
<td width="760" height="560"><table width="760" border="1" align="center" cellpadding="0" cellspacing="0">
<tr>
<tr>
<td width="760" height="560"><table width="760" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="158" colspan="5" align="center"><img src="Assets/RFRugh_Photographs.jpg" alt="RF Rugh Photographs" width="760" height="158" /></td>
</tr>
<tr>
<td width="24" height="375" rowspan="11" align="center">&nbsp;</td>
<td width="100" height="34" align="left"><p class="style1">&nbsp;</p> </td>
<td height="375" rowspan="11" align="center"><img src="Assets/v_rule.jpg" width="2" height="350" /></td>
<td width="532" height="375" rowspan="11" align="center">

<script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','532','heigh t','365','src','RFRUGH_Early','quality','high','pl uginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movi e','RFRUGH_Early' ); //end AC code
</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="532" height="365">
<param name="movie" value="RFRUGH_Early.swf" />
<param name="quality" value="high" />
<embed src="RFRUGH_Early.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="532" height="365"></embed>
</object></noscript></td>

<td width="76" height="375" rowspan="11" align="center">&nbsp;</td>
</tr>
<tr>
<td height="34" align="left"><a href="index.html" title="Home" class="style1">Home</a></td>
</tr>
<tr>
<td height="34" align="left"><span class="style1"> <a href="1985-1989.html" title="1989-1995">1985-1989</a></span></td>
</tr>
<tr>
<td height="34" align="left"><span class="style1"> <a href="1989-1995.html" title="1989-1995">1989-1995</a></span></td>
</tr>
<tr>
<td height="34" align="left"><span class="style1"><a href="1995-2000.html" title="1995-2000">1995-2000</a></span></td>
</tr>
<tr>
<td height="34" align="left"><span class="style1"> <a href="2006-2009.html" title="2006-2009">2006-2010</a></span></td>
</tr>
<tr>
<td height="34" align="left"><span class="style1"> <a href="about.html" title="About">About</a></span></td>
</tr>
<tr>
<td height="34" align="left"><a href="contact.html" title="Contact" class="style1">Contact</a></td>
</tr>
<tr>
<td height="34" align="left"><a href="links.html" title="Links" class="style1">Links</a></td>
</tr>
<tr>
<td width="100" height="34" align="left"><a href="jarvisbeach.html" title="Jarvis Beach" class="style1">Jarvis Beach</a></td>
</tr>
<tr>
<td height="35" align="left">&nbsp;</td>
</tr>
<tr>
<td height="27" colspan="1" align="center"></td>
<td height="27" colspan="3" align="center"><div align="left" class="style3">
<div align="left">2010 Robert F. Rugh All Rights Reserved</div>
</div></td>
<td height="27" align="center"></td>
</tr>
</table>

</table>
</div>
</body>
</html>

Corrosive
04-22-2010, 12:08 PM
Try setting the borders to 0 in the table code. I can't resist saying 'don't use tables for layout' though ;)

bobrugh
04-23-2010, 11:45 AM
I'll try setting borders to 0 and see what happens. Is there any way to have the those same rules image without setting them in the border tag? Since my bkgd is white I need to define where the edges are.