Can anyone tell me why IE6 is not displaying this page correctly? /* CSS Document */ html, body { margin: 0; padding: 0; font: 12px Arial, Helvetica, sans-serif; color: #000; background-color: #fff; } html>body { margin: 1em auto 0 auto; padding: 0; font: 12px Arial, Helvetica, sans-serif; color: #000; background-color: #fff; text-align: center; } #mc-body-center { text-align: center; width: 1000px; margin: 0 auto; padding: 0; } #mc-body { position: relative; margin: 0 auto; text-align: left; padding: 0 0 10px 0; } #header { position: relative; top: 0; left: 0; height: 142px; background: #592046; margin: 0; padding: 10px 0 0 0; } #header_left { position: relative; float: left; padding: 0 0 0 25px; width: 115px; } #header_center { position: absolute; width: 536px; height: 90px; left: 242px; top: 20px; } #header_right { position: absolute; width: 80px; left: 888px; } #mc-menu { height: 32px; font: bold 16px Garamond, "Times New Roman", Times, serif; background-color: #EADAC3; position: relative; border-left: 1px solid #000000; border-right: 1px solid #000000; border-top: 1px solid #756D62; border-bottom: 1px solid #756D62; } #mc-menu ul { margin: 8px 0 0 125px; padding: 0; background-color: #EADAC3; } #mc-menu li { text-transform: capitalize; position: relative; list-style: none; margin: 0; float: left; padding: 0 20px; width: auto; } #mc-menu li a { display: block; line-height: 18px; height: 18px; text-decoration: none; color: #592046; text-align: center; } #mc-menu a:hover { text-decoration: underline; color: #592046; display: block; text-align: center; line-height: 18px; height: 18px; font-weight: bold; } #columns { position: relative; border-top: 0px; border-right: 1px solid #000000; border-bottom: 1px solid #000000; border-left: 1px solid #000000; left: 0; top: 0; margin: 0; padding: 10px 0 10px 0; } #column_left { left: 0; top: 0px; margin: 0; font: 12px/18px Verdana, Arial, Helvetica, sans-serif; padding: 0 0 8px 0; position: relative; width: 650px; } #column_left h1 { font: bold 16px Arial, Helvetica, sans-serif; height: 16px; line-height: 16px; text-transform: uppercase; margin: 10px 0 5px 0; padding: 0; } #column_left p { margin: 2px 0 7px 0; padding: 0 50px 0 0; font: normal 12px/16px Verdana, Arial, Helvetica, sans-serif; } #bottom_column { position: relative; left: 0px; top: 0px; } #column_right { border: 1px solid #009999; float: right; display: inline; width: 336px; margin: 0 0 0 10px; padding: 0; background: #B2C9D0; height: 342px; } #column_right h1 { line-height: 20px; font: bold 14px Arial, Helvetica, sans-serif; text-align: left; text-transform: uppercase; padding: 5px 0; margin: 0 0 0 10px; color: #000; text-decoration: underline; } #column_right p { line-height: 16px; margin: 5px 20px; padding: 0; font: normal 14px/18px Jester, Verdana, Arial, Helvetica, sans-serif; text-indent: 8px; } #copyright { font-size: 10px; color: #592046; text-align: center; clear: both; height: 30px; } .heading { margin: 0; padding: 10px 0 5px 0; } .curving { float: right; clear: right; margin: 0; padding: 0; } .monthact { height: 46px; background-color: #8EA7AF; } .imagetitle { margin: 10px 0 0 51px; } .clearer{ height:1px; overflow:hidden; margin: -1px 0 0 0; clear:both; } Code (markup): <body> <div id="mc-body-center"> <div id="mc-body"> <div id="header"> <div id="header_left"><!-- #BeginLibraryItem "/Library/moms_image.lbi" --> <a href="http://www.momsclub.org/" target="_blank"><img src="images/MOMS_logo.jpg" alt="" width="115" height="124" border="0" /></a><!-- #EndLibraryItem --></div> <div id="header_center"><!-- #BeginLibraryItem "/Library/welcome_image.lbi" --> <a href="http://www.momsclubofripon-salida.org/" target="_self"><img src="images/Welcome_MOMS_Club_Ripon_Sal.gif" alt="Welcome to the MOMS Club of Ripon-Salida, CA" width="536" height="90" border="0" /></a><!-- #EndLibraryItem --></div> <div id="header_right"><img src="images/MOMS_Support.jpg" width="80" height="124" alt="" /></div> </div> <div id="mc-menu"> <ul> <li>Home</li> <li><a href="history.html">History</a></li> <li><a href="service_projects.html">Service Projects </a></li> <li><a href="activities.html">Activities</a></li> <li><a href="recipes.html">Recipes</a></li> <li><a href="join_the_club.html">Join</a></li> <li><a href="links.html">Links</a></li> <li><a href="contact.html">Contact</a></li> </ul> </div> <div id="columns"> <div id="column_right"> <div class="monthact"><img src="images/this_month.jpg" alt="This Month's Activities" class="imagetitle" /></div> <p>Jelly Belly Factory Tour</p> <p>Tune Time</p> <p>Spring Crafts</p> <p>MOMS Club Open House</p> <p>MOMS Night Out (MNO)</p> <p>Park Play</p> <p>Storytime</p> <div id="jelly_bean"> <img src="images/jelly_bean/jelly_bean_02.jpg" class="rightcurve" /> <img src="images/jelly_bean/jelly_bean_04.jpg" class="rightcurve" /> <img src="images/jelly_bean/jelly_bean_06.jpg" class="rightcurve" /> <img src="images/jelly_bean/jelly_bean_07.jpg" class="rightcurve" /> <img src="images/jelly_bean/jelly_bean_08.jpg" class="rightcurve" /> <img src="images/jelly_bean/jelly_bean_10.jpg" class="rightcurve" /> <img src="images/jelly_bean/jelly_bean_11.jpg" class="rightcurve" /> <img src="images/jelly_bean/jelly_bean_13.jpg" class="rightcurve" /> <img src="images/jelly_bean/jelly_bean_15.jpg" class="rightcurve" /> </div> <p>Spring Fling</p> <p>Cooking Club</p> <p>Lunch N' Play</p> <p>Play Group</p> </div> <div id="column_left"> <div class="m1"></div> <div class="m2"></div> <div class="m3"></div> <div class="m4"></div> <div class="m5"></div> <div class="m6"></div> <div class="m7"></div> <div class="m6"></div> <div class="m3"></div> <div class="m8"></div> <div class="m9"></div> <div class="heading"> <img src="images/who_are_we.jpg" alt="Who Are We?" /> </div> <p>We are Moms Offering Moms Support for the at-home mom. We offer support for moms who are looking for advice on the care of not only themselves, but for their children as well.</p> <p>We offer lots of <a href="activities.html">activities</a> for families, moms, children, and even DADS! </p> <p>We also have a Moms Night Out (MNO) once a month for those moms who would like to go out for dinner, movie, or just to gather for a coffee night. Not only is it theraputic, but it's a great way to get to know other moms and a GREAT way to make new friends.</p> <p>If you'd like to join us, potential members are welcome to visit two business meetings before joining the club. If you have any questions, contact us by emailing: </p> </div> </div> </div> </div> <div class="clearer"></div> <div id="copyright"><!-- #BeginLibraryItem "/Library/copyright.lbi" --><p>© 2008 MOMS Club of Ripon Salida, CA. All Rights Reserved.<br /> Problems with this site, please contact the.<br /> ** The MOMS International Club and the MOMS Club of Ripon-Salida, CA does not endorse nor guarantee any products or services advertised **</p> <!-- #EndLibraryItem --></div> </body> HTML: I'm not sure what I'm missing; maybe a hack? toad78
Well, by my attached thumbnail, it's not suppose to look like that. The baby's face should be left of the right column, not left and below. toad78
IE6 is terrible, IE7 isn't much better...FF2.0 is the best at displaying webpages. Lets hope IE8 is as good
How about putting the page in the order its supposed to display? The left column first with a float:left and then the right column with a float:left, long as the sizes are right, works in both IE6 and FF. Plus those lists should be in errr, lists. Might help to get rid of half of the div's in that example.