I have the following web page I'm trying to do in CSS and when I check this in IE6 the main body content is way down at the bottom of the page and in Opera, there is uneveness of the margins and borders. I also can't get the left side bar to float and come down with the main body area so that they are both even. Can someone offer some insight?
Thanks in advance,
lisa
<!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 name="generator" content="
http://www.inknoise.com/experimental/layoutomatic.php" /> <style type="text/css">
#container {
width: 780px;
border: 1px solid gray;
margin-left: auto;
margin-right: auto;
padding: 5px;
margin-top: 10px;
margin-bottom: 10px;
}
#banner {
padding: 3px;
background-color: #FFFFFF;
width:780px;
}
#content {
margin-left: 175px;
background-color: #FFFFFF;
width: 600px;
padding-top: 5px;
}
#sidebar-a {
float: left;
width: 155px;
\width: 155px;
w\idth: 155px;
margin: 0;
margin-right: 5px;
padding: 5px;
background-color: #FFFFFF;
font-size: small;
margin-left:2px;
padding-top: 5px;
border-color: #003399;
border-left-color: #003399;
border-right-color: #003399;
border-top-color: #003399;
border-bottom-color: #003399;
border: #003399 4px solid;
}
#footer {
clear: both;
font-size: small;
width:785px;
background-color: #000000;
color: #FFFFFF;
font-family: Tahoma;
float: none;
text-align: right;
padding-right: 5px;
}
a:link {
color: #000000;
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #000000;
}
a:hover {
text-decoration: underline;
color: #FF9900;
}
a:active {
text-decoration: none;
color: #000000;
}
.style1 {font-weight: bold}
.style2 {
font-family: Tahoma;
font-size: small;
}
.style3 {font-family: Tahoma}
.style4 {font-weight: bold; font-family: Tahoma; }
.style5 {font-size: x-small}
.style6 {font-weight: bold; font-family: Tahoma; font-size: x-small; }
</style>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<!-- TemplateBeginEditable name="doctitle" -->
<title>Clinton Rosette PTA</title>
<!-- TemplateEndEditable -->
<!-- TemplateBeginEditable name="head" --><!-- TemplateEndEditable -->
</head>
<body>
<div id="container">
<div id="banner"><img src="../images/banner.gif"
alt="CRMS banner" width="780" height="125" /></div>
<div id="sidebar-a"><!-- TemplateBeginEditable name="left sidebar" -->
<div align="center">
<p class="style1"> </p>
<p class="style1"> </p>
<p class="style1"> </p>
<p class="style1"> </p>
<p class="style1"><span class="style3"><span class="style5"><a href="
http://dist428.org/rosette">CR
MS Homepage</a></span></span>
</p>
<p class="style6"><a href="
http://dist428.org/"
> Dist 428 Homepage</a></p>
<p class="style6"> <a href="
http://www.dist428.dekalb.k12.il.us/rosette/pta/membership.html">Join CRMSPTA</a></p>
<p class="style4"> <span class="style5"><a href="mailto:acousticlisa@
yahoo.com"
>Contact Us</a></span> </p>
<p class="style4"> </p>
<p class="style4"> </p>
<p class="style4"> </p>
<p class="style4"> </p>
<p class="style4"> </p>
<p class="style4"> </p>
<p class="style4"> </p>
<p class="style4"> </p>
<p class="style4"> </p>
<p class="style4"> </p>
</div>
<!-- TemplateEndEditable --></div>
<div id="content">
<p align="center"><img src="../images/main.gif" alt="Barbie Crow section header" width="500" height="100" /></p>
<blockquote>
<blockquote>
<p>
</blockquote><span class="style2">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wi </span> </p>
<p class="style2">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure d</p>
<p class="style2"> </p>
</blockquote>
</blockquote>
<p align="center"><img src="../images/main.gif" alt="Barbie Crow section header" width="500" height="100" /></p>
<blockquote>
<blockquote> <span class="style2">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla faci</span> </blockquote>
</blockquote>
<div align="left"></div>
</div>
<div id="footer"> © CRMS PTA<br/>
Developed by Janene Smith & Lisa Wilcox
<div align="right"></div>
<div align="center"></div>
</div>
</div>
<div align="center"><span class="style2"><a href="
http://www.dist428.dekalb.k12.il.us/rosette/pta/membership.html">Join CRMS PTA</a>| <a href="
http://www.dist428.dekalb.k12.il.us">Dis
t. 428 homepage</a> | <a href="
http://dist428.org/rosette">CR
MS homepage</a> |<a href="#">Other links </a></span></div>
</body>
</html>
Start Free Trial
