This site displays as intended in Firefox, Safari and some versions of IE. But it is horribly off in IE 6 & 7.
I know it has something to do with margins, padding and width of the divs and floats, but I can't figure out how to fix it.
Posting HTML and CSS below. Thanks in advance!
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Kate M. Gilbert</title>
<link href="KMG.css" rel="stylesheet" type="text/css" />
<body id="Welcome">
<div id="container">
<div id="banner">
<div id="flash"></div>
<div id="headerText">
<h1>Aliquam pellentesque</h1>
<h3>Proin nisl erat,</h3>
</div>
</div>
<div id="top_navlist">
<ul id="navlist">
<li><a href="#', 'contentBody')"; id="#">Vestibulum</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">Nullam</a></li>
<li><a href="#">malesuada</a></li>
<li><a href="#">Praesent</a></li>
<li><a href="#">dignissim</a></li>
</ul>
</div>
<div id="content">
<div id="contentBody">
<div id="sidebarLT"></div>
<div id="mainContent">
<h2>Cras mi lacus,</h2>
<p> Curabitur lacinia purus quis nisl. Fusce imperdiet interdum augue. Curabitur quis quam eget sem imperdiet faucibus. Nulla vitae erat quis urna bibendum euismod. Nunc velit enim, ornare in, consequat consequat, lobortis a, erat. Curabitur nec nulla.</p>
<p>
<img src="images/spacer.gif" width="30" height="5" />Donec sit amet enim.<br />
<img src="images/spacer.gif" width="30" height="5" />Ut magna turpis, # <br />
<img src="images/spacer.gif" width="30" height="5" /><a href="http://www.wordpress.org" title="WordPress" target="_blank">WordPress</a> training and support<br />
<img src="images/spacer.gif" width="30" height="5" />sodales elementum, vestibulum at, vu
</p>
<p>Cras velit turpis, suscipit sit amet, auctor facilisis, sodales eget, felis. Curabitur in mi. Pellentesque at risus. </p>
</div>
</div>
</div>
<p align="center">
<div id="footerLinks">
<p align="center">
<b>Designed by <a href="#">Kate M. Gilbert </a><br />Copyright 2009</b></p>
</div>
</p>
</div>
</body>
</html>
/*
WP Design template for Department of Medicine site, Jan. 2009
*/
/*/////////////GENERAL////////////////////////////////////////////*/
body{
margin:0px;
text-align:center;
padding:20px;
}
#banner {
height:200px;
}
#container {
margin: 0 auto;
width: 1190px;
height:100%;
height:800px;
background-image:url(images/silverWithBorder.gif);
background-repeat:repeat;
}
#container2 {
width: 180px;
height:450px;
overflow-y: auto;
overflow-x: hidden;
}
#containerBody {
}
#content {
margin-left: 85px;
margin-right: 85px;
width: 1020px;
height: 400px;
float: left;
background:url(images/linenBG.gif);
background-repeat:repeat;
overflow
;
border-color:#333333;
border-bottom-width:thick;
}
#flash {
float: left;
width: 350px;
height: 205px;
margin-top:15px;
margin-bottom: 15px;
margin-left: 85px;
background-image:url(images/Hummingbird.gif);
}
#contentBody {
margin: 0 0;
padding:10px;
float: right;
width: 990px;
}
#mainContent {
width:780px;
text-align:left;
padding: 10px;
margin-left:200px;
}
#headerText{
float: left;
margin-top: 10px;
margin-left: 50px;
text-align:left;
padding-top: 50px;
}
div.items p {display: none}
div.items p:target {display: block}
/*////////// SIDEBARS //////////*/
#sidebarLT {
width: 170px;
height: 250px;
float: left;
padding-left: 15px;
}
#sidebarContent {
margin-bottom: 10px;
text-align:left;
}
#sidebarRT {
width: 170px;
height: 250px;
float: left;
padding-left: 15px;
}
#widgets {
width: 200px;
height: 450px;
float: left;
padding-top: 15px;
background-color:#E0E0E0;
}
/*////////////TYPOGRAPHY///////////////////////////////////////*/
h1 {
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
font-size:36px;
color:#212121;
font-weight:bold;
line-height:40px;
}
h2 {
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 30px;
color:#212121;
line-height:40px;
font-weight:bold;
}
h3 {
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 24px;
line-height: 28px;
}
h4 {
font-size: 16px;
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
}
p {
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 14px;
line-height: 16px;
}
i {
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 14px;
line-height: 16px;
}
a {
color: #12284e;
text-decoration: none;
font-weight: bold;
}
a:link {
color: #12284e;
}
a:visited {
color: #754d0d;
}
a:hover {
color: #754d0d;
text-decoration:underline;
}
a:active {
color: #12284e;
}
/*////////// HEADERS //////////*/
#header p, #header h1, #header h2/**/ {
display: none;
}
/*//////////////////////TEXT HEADERS/////////////////////////////*/
#contentHeader {
margin: 0 0;
float: right;
background-image: url(New%20site/images/big-headers.gif);
background-repeat:repeat-x;
width: 600px;
}
#sidebarHeader {
margin: 0 0px;
background-image: url(New%20site/images/big-headers.gif);
background-repeat:repeat-x;
width: 260px;
}
#sidebarBody {
padding:10px;
background-color:#FFF;
width: 180px;
float:right;
}
/*////////////////////// NAV ///////////////////////////////////*/
body#patient a#patientLink,
body#education a#educationLink,
body#research a#researchLink {
background: url(New%20site/images/singleTabs.gif) no-repeat;
background-color:#212121;
background-position: 0 -45px;
}
#top_navlist {
top: 280px;
width: 1020px;
float:left;
text-align:right;
margin-left:85px;
}
#top_navlist h2{
display: none;
}
#navlist{
font-weight:bold;
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
font-size: 18px;
line-height: 40px;
}
#navlist li{
float: right;
text-align: center;
width:160px;
height: 45px;
list-style-type:none;
}
#navlist a {
display: block;
}
#navlist ul {
margin: 0;
}
#navlist li a{
background:url(images/singleTabs.gif);
color: #E0E0E0;
}
#navlist li a:link { color: #E0E0E0; }
#navlist li a:visited { color: #E0E0E0; }
#navlist li a:hover{
background-position: 0 -45px;
color: #212121;
text-decoration: none;
}
#navlist li.current_page_item a{
background-color:#E0E0E0;
background-position: 0 -45px;
}
#navlist li a#current{
color: #E0E0E0;
background: url(New%20site/images/singleTabs.gif) no-repeat;
background-position: 0 -45px;
}
#silver_navlist {
width: 180px;
float: right;
margin-left: 15px;
margin-right: 15px;
}
#pushbottom{
clear: both;
}
/*////////////////////// FOOTER ///////////////////////////////////*/
#footer {
margin: 0 auto;
height: 80px;
width: 1190px;
background-image:url(images/Silverbg.gif);
background-repeat:repeat;
}
#footerRight {
margin: 0 auto;
width: 200px;
float: right;
padding-top: 5px;
}
#footerLinks {
width: 400px;
float:left;
margin-left: 385px;
margin-right:385px;
font-size:16px;
}
#footerLeft {
margin: 0 auto;
width: 200px;
float:left;
padding-top: 5px;
}
/*TOC Nav*/
.tocNav{
padding-left: 0;
margin-left: 0;
width: 200px;
}
tocNav li{
list-style: none;
margin: 0;
padding: 0.25 em;
}
tocNav li a { text-decoration: none; }
utside;
