Forum Moderators: not2easy
The problem is, in the first column, which is about 165 pixels wide, i have a table, i have set the width on this table to 100% so it should fit perfectly inside the column, which it does it firefox and ie7. But in ie6 it just spans across both columns and covers the entire page.
Heres the code for the layout, devoid of any content.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Untitled Document</title>
<link rel="stylesheet" href="/css/main.css" type="text/css">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<body>
<div id="outerborder">
<div id="innerborder">
<div id="header">Header image</div>
<div id="navigation"> Links and Stuff </div>
<div id="wrapper">
<div id="leftpane">
Main navigation
</div>
<div id="rightpane">
Content
</div>
</div>
<div id="footer">
Footer
</div>
</div>
</div>
</body>
</html>
And the css...
body{ background:url('/images/background.gif');}
body,td,p{ color:#000000; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px;}a{ color:#990000; text-decoration:none;}
a:visited{ color:#990000; text-decoration:none;}
a:hover{color:#FF6600;}
#navigation a{ color:#990000; text-decoration:none; font-weight:bold;}
#navigation a:visited{ color:#990000; text-decoration:none;font-weight:bold;}
#navigation a:hover{color:#FF6600;font-weight:bold;}
.allie{ color:#336600; }
.enemy{ color:#FF0033; }
#outerborder{ width:85%; border:#7A7A7A 1px solid; text-align:left; margin:auto;}
#innerborder{ border:#000000 5px solid; background:#ADAFB1;}
#navigation{ padding:5px; border-top:#000000 1px solid; border-bottom:#000000 1px solid;background:url('/images/gradient_bg.gif');background-repeat:repeat-x; text-align:center;}
#wrapper{ background:url('/images/leftbar.gif') repeat-y left;}
#leftpane{ float:left; width:165; padding:5px; background:url('/images/leftbar.gif') repeat-y left; max-width:165px; text-align:left; }
#rightpane{ padding:5px 5px 5px 180px; }
#contentpane{ padding:5px; }
#footer{ clear:both;border-top:#000000 1px solid;padding:5px;text-align:center;}
#header{ background:url('/images/banner_bg.gif'); background-repeat:repeat-x; height:130px;}
#fullbox{ background:#A2A2A2; padding:5px; border:#888888 1px solid; }
h1{ font-family: Verdana, sans-serif;font-size: 1.8em;font-weight:bold;color:#000000; margin:0;}
h2{ font-family: Verdana, sans-serif;font-size: 1.4em;font-weight:bold;color:#000000; margin:0;}
hr { border:0; color:#888888; background-color:#888888; height:1px; width:100%; text-align:left; }
fieldset{ border:#7A7A7A 1px solid; background:#888888; }
legend{font-size: 1.1em;font-weight:bold;}
img{border:0px; }
table.center {margin-left:auto; margin-right:auto;}
table{ width:99%; }
#center{ text-align:center; }
img.menu{border:0px; display:block;}
table.allborders{ background:#ADAFB1; }
table.allborders td{ background:#888888; }
table.allborders td.header{height:22px; background:url('/images/table_header.gif'); padding-top:0px;padding-bottom:0px; text-align:center; font-weight:bold;}
table.allborders td.dark{ background:#888888; }
table.allborders td.light{ background:#A2A2A2; }
table.smaller{ width:auto; background:#ADAFB1; }
table.smaller td{ background:#888888; }
table.smaller td.header{height:22px; background:url('/images/table_header.gif'); padding-top:0px;padding-bottom:0px; text-align:center; font-weight:bold;}
table.smaller td.dark{ background:#888888; }
table.smaller td.light{ background:#A2A2A2; }
input,select,textarea{ border:#7A7A7A 1px solid;background:#CCCCCC;color:#000000;font-size:10px; }
form{ margin:0;padding:0; }
.left{float:left;}
.right{float:right;}
TIA
