Page aligned to center IE9
Question
On this site I'm gonna offer this Xmas to my brothers-in-law, I have a page structure like this:
<body>
<div id="container">
<div id="menu">[...]</div>
<div id="wrapper">
<div id="section1">[...]</div>
<div id="section2">[...]</div>
etc etc etc
</div>
</div>
</body>
All looks perfect on Firefox... but on my IE9, the page isn't aligned and the @font-face isn't loading either...
The CSS goes like this (looks to me there's no problem here)
#container{width:960px;margin:0 auto;position:relative}
#wrapper{width:780px;float:right;margin-bottom:30px}
#menu{width:180px;float:left;background:url(../img/site/menu_bg.jpg) repeat-y right;height:100%;position:fixed;padding-top:55px}
Already tried a different set-ups with no change at all ... and I'm starting to rip my hair off here ... any suggestions?
Thanks in advance.
PS: If it helps ... the page in question is: www.sweetdreams.pt/escondido.php
EDIT: As requested ... this is the beggining of the code in the page:
<?php if(!ob_start("ob_gzhandler")) ob_start(); ?>
<!DOCTYPE html>
<html lang="pt-PT">
3 answers
solution1
2 ACCPTED 2012-12-20 17:17:49
Are you by any chance running IE in Compatibility Mode? (check this by pressing F12 and looking at the Developer tools below in the browser window.
EDIT:
In IE, it pays to have a DOCTYPE declaration, otherwise it will just go to Quirks mode.
Please do post full HTML source.
solution2
2 2012-12-20 18:22:11
The document type declaration must be at the very first line in the file, otherways it's ignored. It also must not preceeded by any characters, ie no blank lines, spaces, tabs, nothing, just <!DOCTYPE html> .
solution3
1 2012-12-20 17:16:58
instead of { margin: 0 auto; } try...
#container {
position: absolute;
left: 50%;
width: 960px;
margin-left: -480px; /* half of width */
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.