margin：0仅在IE中自动不起作用
[英]margin: 0 auto not working in IE only
问题描述
I am trying to center a div #logo_alt containing an image using margin: 40px auto 0px auto; 
我试图使用margin: 40px auto 0px auto;包含图像的div #logo_alt margin: 40px auto 0px auto; . 。
Problem: : On Chrome, it looks perfect, but in IE, this img-containing div is aligned to the left of its parent container #header_organizer . 问题::在Chrome上，它看起来很完美，但在IE中，这个包含img的div与其父容器#header_organizer的左侧对齐。 I just cant figure out why this is happening, and how it can be fixed in IE! 我只是无法弄清楚为什么会发生这种情况，以及如何在IE中修复它！ Any help greatly appreciated :) 任何帮助非常感谢:)
HTML HTML
<div id="header_organizer">
<div id="user_bar">...</div>
<div id="user_bar_menu">...</div>
<div id="logo_alt"> <!-- <<<<< We are centering this div! -->
<img src="logo.png" \>
</div>
</div>
CSS CSS
#header_organizer {
width: 100%;
height: 180px;
background: black url(../images/template/header.png);
float: left;
position: relative;
z-index: 1000;
}
#logo_alt {
width: 256px;
height: 55px;
margin: 40px auto 0px auto;
}
#user_bar {
height: 30px;
color: #CCC;
font-size: 13px;
margin-right: 10px;
padding: 0px 5px;
float: right;
cursor: pointer;
position: relative;
z-index: 3000;
}
#user_bar_menu {
width: 200px;
height: 165px;
background: white;
border: 1px solid #BEBEBE;
float: right;
position: absolute;
top: 30px;
right: 10px;
-moz-box-shadow: -1px 1px 1px rgba(0,0,0,.2);
-webkit-box-shadow: 0 2px 4px rgba(0,0,0,.2);
box-shadow: 0 2px 4px rgba(0,0,0,.2);
display: none;
z-index: 1000;
border-image: initial;
}
2 个解决方案
解决方案1
10 已采纳 2012-02-11 17:18:28
The HTML file start off with
<html xmlns="http://www.w3.org/1999/xhtml">.<html xmlns="http://www.w3.org/1999/xhtml">开头。
Well there's your problem. 那是你的问题。 You need to give your document an XHTML doctype declaration since your root element has that xmlns attribute anyway. 您需要为文档提供XHTML doctype声明，因为您的根元素仍然具有该xmlns属性。 Then IE will work in standards mode and render your margin: 0 auto style correctly. 然后IE将在标准模式下工作并渲染您的margin: 0 auto样式正确。
解决方案2
1 2012-02-11 17:18:44
Firstly, add a doctype to prevent IE from slipping into quirks more. 首先，添加一个doctype以防止IE更多地陷入怪癖。
Then try this... 然后尝试这个......
body {
width: 100%;
}
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.