2013-07-26 3 views
0

Странно IE7 ошибка, что я понятия не имею о ...IE7 - маржа: авто влияет на двойников элемент

Херес HTML:

<header> 
    <div class='header-overlay'> 
     <div class='header-overlay-content'> 
       <ul> 
        <li>Contact Us</li> 
        <li>FAQs</li>   
       </ul> 
      </div> 
    </div> 
    <div class="nav"></div> 
</header> 

И применимое CSS:

header { 
    background: url('img/header-background.jpg') center no-repeat; 
    height: 325px; 
    width:100%; 
} 

.header-overlay { 
    height: 70px; 
    width: 100%; 
    position: absolute; 
    background-color: #fff; 
} 

.header-overlay-content { 
    height: 100%; 
    width: 1000px; 
    margin: 0 auto; 
    position: relative; 
    border: 1px solid red; 
} 

.nav { 
    background: url('img/main-nav-blank.png') no-repeat; 
    width: 1000px; 
    height: 57px; 
    position: relative; 
    top: 235px; 

    margin: 0 auto; /* this causes problems! */ 
} 

В принципе, заголовок-оверлей должен охватывать всю ширину страницы вверху (следовательно, ширина: 100%), а nav - это полоса, которая горизонтально центрирована на несколько сотен пикселей ниже нее. Они не имеют никакого отношения, кроме того родственные элементы в заголовке, но IE7 делает их так:

enter image description here

заголовок-оверлей получает толкнул ту же сумму, что Nav делает - совершенно озадачивают меня, почему это произошло, и это не происходит ни в каком другом браузере, включая IE8 ... помощь, пожалуйста ?!

+0

я не могу проверить его потому что у меня нет IE7 здесь, но вы можете попробовать установить верхнюю и левую части оверлея на 0 (абсолютный элемент) – Huangism

+0

да, это, казалось, сделало трюк ... _sigh_ – romeboards

+0

Для устаревшего IE это всегда боль, ставя сверху и влево просто безопаснее – Huangism

ответ

0

Добавить CSS

.header-overlay { 
    height: 70px; 
    width: 100%; 
    position: absolute; 
    background-color: #fff; 
    top: 0; 
    left: 0; 
} 

Абсолютных ДИВЫМ думают, он должен начать Whee запусков контента, и поскольку только содержание у вас есть СЧ, так что запутались

Смежные вопросы