Я пытаюсь центрировать div #logo_alt
, содержащий изображение, используя margin: 40px auto 0px auto;
.
Проблема: : в Chrome это выглядит идеально, но в IEсодержащий div выравнивается слева от его родительского контейнера #header_organizer
.Я просто не могу понять, почему это происходит, и как это можно исправить в IE!Любая помощь с благодарностью:)
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
#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;
}