OAFC_Rob Posted June 8, 2011 Share Posted June 8, 2011 Hey,I'm having some positioning issues in IE, but not in firefox please see the attached images. The firefox is what I want it to look like, any idea how to fix it, see the CSS below; @charset "utf-8"; /* CSS DOCUMENT FOR INNOVATIONATION UK BY ROBERT ROSEBURY ** NOTE . = CLASS AND # = ID ** ** NOTE PADDING / MARGIN: TOP RIGHT BOTTOM LEFT; */ /* BACKGROUND / GENERAL CSS STYLINGS */ body { background: url('../images/container/03.png') repeat-x top #DADADA; padding: 0px; font-family: Arial, Helvetica, sans-serif; font-size: 12px; margin: auto; color: #0d294f; } /* PAGE / VIEW CONTAINER */ #viewContainer { width: 960px; height: auto; margin: auto; padding: 0px; } /* HEADER CONTAINER */ #headerContent { color: #0d294f; width: 960px; margin: 25px auto auto auto; } /* LOGO CONTENT */ .logoContent { color: #66ffff; } /* MAIN CONTENT */ .mainContent { margin: 25px auto 25px auto; } /* COLMUNS / PARAGRAPH SECTIONS */ .paraBlockLeft { float: left; width: 640px; } .leftTop { background: url('../images/container/04.png') no-repeat top; height: 25px; } .leftMiddle { background: #FFFFFF; border-left: 1px solid #010101; border-right: 1px solid #010101; height: 105px; } .leftBottom { background: url('../images/container/05.png') no-repeat bottom; height: 25px; } .paraBlockRightTop { float: right; width: 310px; } .paraBlockRightBottom { float: right; width: 310px; } .rightTop { background: url('../images/container/06.png') no-repeat top; height: 25px; } .rightTopSecond { background: url('../images/container/06.png') no-repeat top; height: 25px; margin-top: 25px; } .rightMiddle { background: #FFFFFF; border-left: 1px solid #010101; border-right: 1px solid #010101; } .rightBottom { background: url('../images/container/07.png') no-repeat bottom; height: 25px; } .clearArea { clear: both; } .fullWidthContent { width: 960px; } .fullWidthTop { background: url('../images/container/08.png') no-repeat top; height: 25px; margin-top: 25px; } .fullWidthMiddle { background: #FFFFFF; border-left: 1px solid #010101; border-right: 1px solid #010101; } .fullWidthBottom { background: url('../images/container/09.png') no-repeat bottom; height: 25px; } /* LEFT FOOTER CONTENT - COPYRIGHT */ .leftFooter { float: left; background: #FFFFFF; margin-left: 30px; margin-top: -5px; color: #666666; cursor: default; font-size: 10px; width: 330px; } /* RIGHT FOOTER CONTENT - ADMIN LINKS */ .rightFooter { float:right; background: #FFFFFF; margin-right: 40px; margin-top: -5px; font-size: 10px; width: 385px; display: inline; } [attachment deleted by admin] Quote Link to comment Share on other sites More sharing options...
OAFC_Rob Posted June 8, 2011 Author Share Posted June 8, 2011 Here is the firefox image [attachment deleted by admin] Quote Link to comment Share on other sites More sharing options...
cssfreakie Posted June 8, 2011 Share Posted June 8, 2011 I don't have to look at the code to guess that your missing something which is at the number 1 spot in the sticky of this thread. Your missing a (valid) Doctype. So as stated in the sticky please read that. Quote Link to comment Share on other sites More sharing options...
OAFC_Rob Posted June 8, 2011 Author Share Posted June 8, 2011 <!-- DATABASE CONNECTION TO GO HERE --> <!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> <title> Innovationation UK | Website Development | Bespoke Websites | Robert Rosebury </title> <!-- META DATA --> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252" /> <meta name="keywords" content=""/> <meta name="description" content ="" /> <!-- SHORTCUT IMAGE --> <link rel="shortcut icon" href="<?php $_SERVER["DOCUMENT_ROOT"] ?>/innovationation1/commonResources/images/container/favicon.ico" /> <!-- MAIN CSS FILE --> <link rel="stylesheet" type="text/css" href="<?php $_SERVER["DOCUMENT_ROOT"] ?>/innovationation1/commonResources/css/style.css" /> <!-- PUT COMMON JAVASCRIPT FILES IN AN INCLUDE 05/05/2011 --> </head> <body> <div id="viewContainer"><!--OPEN DIV FOR VIEW CONTAINER --> <div id="headerContent"><!--OPEN DIV FOR HEADER CONTENT --> <div class="logoContent"><!--OPEN DIV FOR LOGO CONTAINER --> <a href="index.html"><img src="<?php $_SERVER["DOCUMENT_ROOT"] ?>/innovationation1/commonResources/images/container/logo.png" alt="Innovationation Logo" longdesc="Innovationation home link" /></a> </div><!--CLOSE DIV FOR LOGO CONTAINER --> <div class="fullWidthContent"> <div class="fullWidthTop"> </div> <div class="fullWidthMiddle"> NAVIGATION AREA </div> <div class="fullWidthBottom"> </div> </div> </div><!--CLOSE DIV FOR HEADER CONTENT --> <div class="mainContent"> <div class="paraBlockLeft"> <div class="leftTop"> </div> <div class="leftMiddle"> MAIN PAGE CONTENT </div> <div class="leftBottom"> </div> </div> <div class="paraBlockRightTop"> <div class="rightTop"> </div> <div class="rightMiddle"> NEWS / BLOG AREA </div> <div class="rightBottom"> </div> </div> <div class="paraBlockRightBottom"> <div class="rightTopSecond"> </div> <div class="rightMiddle"> ADVERTS / IMAGES / OTHER </div> <div class="rightBottom"> </div> </div> </div> <div class="clearArea"></div> <div class="fullWidthContent"> <div class="fullWidthTop"> </div> <div class="fullWidthMiddle"> <div class="leftFooter"><!--OPEN DIV FOR LEFT FOOTER--> © <?php echo date(Y); ?> All Rights Reserved | Design by <a href="http://www.innovationation.co.uk/">Innovationation UK</a> </div><!--CLOSE DIV FOR LEFT FOOTER--> <div class="rightFooter"><!--OPEN DIV FOR RIGHT FOOTER--> <a href="">Copyright | </a> <a href="">Disclaimer | </a> <a href="">Privacy Policy </a> <a href="">Terms of Use | </a> <a href="">Site Map | </a> <a href="loginArea/login.php">Admin</a> </div><!--CLOSE DIV FOR RIGHT FOOTER--> </div> <div class="fullWidthBottom"> </div> </div> </div><!--CLOSE DIV FOR VIEW CONTAINER --> </body> </html> Quote Link to comment Share on other sites More sharing options...
cssfreakie Posted June 8, 2011 Share Posted June 8, 2011 try to remove <!-- DATABASE CONNECTION TO GO HERE --> Doctype should be the very first thing And if it's not... it's still polite to response not as a computer by just pasting code. But this is the very first thing that happens someone doesn't have a working doctype. IE will go in to quirksmode. If you by the way have an online example it probably would make more sense in the specific situation Quote Link to comment Share on other sites More sharing options...
OAFC_Rob Posted June 8, 2011 Author Share Posted June 8, 2011 Cheers I forgot about that, should have been in this format instead <?php #DATABASE CONNECTION TO GO HERE ?> Quote Link to comment Share on other sites More sharing options...
cssfreakie Posted June 8, 2011 Share Posted June 8, 2011 Cheers I forgot about that, should have been in this format instead <?php #DATABASE CONNECTION TO GO HERE ?> Do you have an online example?? or did you meant with the above that it was fixed? -edit: i guess it is, good luck with the innovation!.. Quote Link to comment Share on other sites More sharing options...
OAFC_Rob Posted June 8, 2011 Author Share Posted June 8, 2011 It's all fixed for now, the site isn't live at the moment, re-developing it as the old one sucks big time now Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.