Почему этот относительный позиционированный div по-разному отображается в IE?

Question

У меня есть относительное расположение div внутри другого div. Внутренний div расположен с процентом (слева: 0%; сверху: 13%).

Моя проблема в том, что во всех версиях IE div отображается на несколько пикселей ниже, чем в Chrome, или FF ...

Кто-нибудь это признает?

   <div class="nav_container" id="nav_container">
   <div id="nav_container2" style="position: relative; left: 0%; top: 13%;"></div>
   </div>

Кроме того, я как раз собираюсь настроить браузер на моем веб-сайте, поэтому я хотел бы прочитать статью о наиболее распространенных проблемах с IE.

Спасибо

UPDATE:

Вот стиль для основного div.

.nav_container {
    background-image: url(../Graphics/menu_lvl1.gif);
    height: 101px;
    width: 720px;
}

Answer 1

Я предполагаю, что IE отображает отступы / поля не так, как Chrome / Firefox (что обычно является проблемой с ошибками макета).

Лучше всего указывать padding и margin, когда положение имеет значение, в противном случае вы оставляете его до значений по умолчанию браузера (которые все разные).

Вы также должны убедиться, что ваша страница не загружается в Quirks Mode IE. Убедитесь, что у вас есть правильное определение DOCTYPE в верхней части страницы, чтобы заставить IE загружаться в стандартный режим. В W3Schools есть краткое изложение того, где и как его использовать:

W3Schools - HTML-декларация типа документа

А затем у W3C есть список всех допустимых объявлений:

W3C QA - рекомендуемый список объявлений Doctype, которые вы можете использовать в своем веб-документе

Если ни один из них не позаботится об этом, вы можете создать CSS для конкретной версии IE и загрузить их с помощью Условных комментариев. Это позволит вам указать разные значения для top на основе IE.

Answer 2

@ Camran

Вот, бро, надеюсь, это вам поможет. http://www.positioniseverything.net/articles/cc-plus.html Все полностью подробно и легко следовать. Поверьте мне, у меня возникла та же проблема, и меня убивают все, с кем я говорил, кто утверждал, что они профессионалы, постоянно заявляют, что идеальное расположение невозможно, но вот кто-то нашел решение

Answer 3

Убедитесь, что IE не работает в режиме причуд. Это происходит, когда у вас есть текст перед объявлением doctype. Если он находится в режиме причуд, он ведет себя ужасно для CSS. Ну, больше, чем обычно.

Answer 4

Попробуйте сбросить таблицу стилей и посмотрите, поможет ли это. Включите его перед любыми другими объявлениями CSS.

Answer 5

Вы используете сброс CSS? (http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/) Это поможет вам убедиться, что все ваши браузеры запускаются с одинаковыми отступами и полями по умолчанию.

Answer 6

Используйте условные комментарии для целевой IE и измените top соответственно.

ИМО, это ОДНА вещь, которую вам нужно знать для решения проблем IE.