Is there anyone who would mind taking a look at the coding and tell me what doltish thing I have done wrong. It shows fine in IE but is all wonky in Firefox. http://www.kayzoe.com/pages/template9/template9.html Thank you, thank you!!!
Never go for a CSS layout unless you know what you are doing. Here is a quick remake of the template. Not perfect, yet the main Firefox problem fixed. There are spacing differences between firefox and IE to be sorted but this is up to you, really if you can live with that. And I have fixed the search box align problem, too. Compare the code below with yours and adjust the original to reflect the fixes <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html><head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><title>Template 5</title> <style type="text/css"><!-- body { margin: 0px; padding: 0px; background-color: #b1bddd; background-image: url('http://www.kayzoe.com/pages/template9/backtile.jpg'); background-repeat: repeat-x; background-position: 0px 195px; align= center; } #mainblock { position:relative; width:750px; z-index:1; padding: 5px; margin-right: auto; margin-left: auto; margin-top: 25px; border-right-width: 1px; border-left-width: 1px; border-right-style: solid; border-left-style: solid; border-right-color: #6c86b2; border-left-color: #6c86b2; border-top-width: 1px; border-bottom-width: 1px; border-top-style: solid; border-bottom-style: solid; border-top-color: #6c86b2; border-bottom-color: #6c86b2; background-color:white; clear: both; } #logo { display: block; float: left; margin-bottom: 5px; } #headertblock { display: block; float: right; } #upmenu { list-style-type: none; display: block; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; color: #3f3e3e; text-align: right; margin-top: 10px; margin-bottom: 12px; margin-right: 5px; } #upmenu li { display: inline; } #upmenu a { color: 3f3e3e; text-decoration: none; } #upmenu a:hover { color: #3F5D8F; text-decoration: underline; } #topnav { background-color:#39231F; height:25px; color:white; text-align:center; } #topnav a { color: #ffffff; text-decoration: none; } #topnav a:hover { color: #3F5D8F; text-decoration: underline; } #main { border-top: 1px solid #6c86b2; } #left { border-right-style: dotted; border-right-width: 1px; border-right-color: #6c86b2 } .leftmenu { list-style-type: none; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #3f3e3e; clear: both; margin-bottom: 15px; line-height: 16px; display: block; } .leftmenu li { line-height: 16px; } .leftmenu a { color: #3f3e3e; text-decoration: none; } .leftmenu a:hover { color: #445781; text-decoration: underline; } .shop { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: #6c86b2; clear: both; margin-bottom: 2px; } #right { padding-left: 10px; } #mainpic { border: 1px solid #6e93b6; display: block; margin-right: 10px; } #pics { border: 1px solid #94bc59; margin-bottom: 16px; display: block; } .txt { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #3f3e3e; margin-top: 15px; clear: both; } #footer { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; text-align: center; color: #ffffff; line-height: 16px; margin-top: 10px; } #footer a { color: #ffffff; text-decoration: none; } #footer a:hover { color: #8F8F8F; text-decoration: underline; } .style1 { background-color: #b1bddd; } .style2 { font-family: Verdana; font-size:11px; } .style3 { border-width: 0px; } --></style></head><body> <div id="mainblock"> <div id="header"> <a href="http://www.kayzoe.com/pages/template9/template9index.html"> <img alt="" src="template9_files/temp9logo.gif" id="logo" class="style3" height="70" width="290"></a> <table id="headertblock" border="0" cellpadding="0" cellspacing="0" align="right"> <tbody><tr> <td nowrap="nowrap"> <ul id="upmenu"> <li><a href="#">home</a></li> <li>|</li> <li><a href="#">contact us</a></li> <li>|</li> <li><a href="#"> store policies</a></li> <li>|</li> <li><a href="#" target="_blank"></a><a href="#">view cart</a></li> </ul></td> </tr> <tr> <td align="right"> <form method="post" action="http://www.kayzoe.com" style="margin: 0pt;"><input name="keyword" size="25" type="text"> <img alt="" src="template9_files/search.gif" height="21" width="48"></form> </td></tr> </tbody></table> </div> <br clear="all" /> <div id="main"> <table border="0" cellpadding="0" cellspacing="0" width="100%"> <tbody><tr> <td id="topnav" colspan="3"> <a href="http://www.kayzoe.com/pages/template9/template9.html">Online Shopping </a> <a href="http://www.kayzoe.com/pages/template9/template9.html">Gift Registry</a> <a href="http://www.kayzoe.com/pages/template9/template9.html">Store Policies</a> <a href="http://www.kayzoe.com/pages/template9/template9.html">Company Info</a> <a href="http://www.kayzoe.com/pages/template9/template9.html">Contact Us</a></td></tr> <tr> <td colspan="3" height="5"></td> </tr> </tbody></table><table border="0" cellpadding="0" cellspacing="0" height="750" width="100%"> <tbody><tr> <td colspan="2"><img src="template9_files/spacer.gif" alt="" height="15" width="1"></td> </tr> <tr> <td id="left" align="left" valign="top" width="150"> <div class="shop">Shop</div> <div class="leftmenu"> <a href="#" nowrap=""> Category</a><br><a href="#" nowrap=""> Category</a><br><a href="#" nowrap=""> Category</a><br><a href="#" nowrap=""> Category</a><br><a href="#" nowrap=""> Category</a><br><a href="#" nowrap=""> Category</a><br></div><br> <div class="shop">Information</div> <div class="leftmenu"> <a href="#" nowrap=""> Site Map</a><br><a href="#" nowrap=""> Customer Service</a><br><a href="#" nowrap=""> Gift Registry</a><br><a href="#" nowrap=""> Order Tracking</a><br><a href="#" nowrap=""> FAQs</a><br><a href="#" nowrap=""> Optional Page</a><br><a href="#" nowrap=""> Optional Page</a><br><a href="#" nowrap=""> Optional Page</a><br><a href="#" nowrap=""> Optional Page</a></div> </td><td id="right" valign="top"><table border="0" cellpadding="0" cellspacing="0" width="100%"> <tbody><tr> <td valign="top"> <span class="style2">Categories, products and page information will go here.</span><br></td> </tr> </tbody></table> </td> </tr> <tr> <td colspan="2"><img src="template9_files/spacer.gif" alt="" height="15" width="1"></td> </tr> </tbody></table> </div> </div> <div id="footer" class="style1"> Copyright 2006 - yourwebsitename <br> Website Design - <a target="_blank" href="http://www.kayzoe.com/">Kayzoe Designs.</a> Powered by <a target="_blank" href="http://www.merchantmoms.com/">Merchant Moms</a></div> </body></html> Code (markup):