Мой основной проект: Боевые искусства в кинематографе! (fight-films.info)

Свеженькое
Реакция публики
Облако пометок

Настройка дизайна под IE, или борьба с багами

IEПри создании сайта (точней, при верстке дизайна для него) у многих веб мастеров возникают проблемы с отображениям сайтов в разных браузерах. Больше всего головной боли со старыми версиями 6/7, так как Microsoft не обновляет их. Часто для покупателя шаблона очень важно что бы его сайт был крос-браузерным, а для этого необходимо доставать бубен.

Но в принципе не все так плохо, проблема решается.

Продвинутые верстальщики всегда находят выход из положение, прикручивая разные фиксы к Internet Explorer. О нескольких способах напишу.

Способ №1 - Условные комментарии:

Делаем файл со стилями для конкретного браузера. Что бы эти стили работали в шаблоне мы вставляем условный комментарий.

Для IE 7:

<!--[if IE 7]> Инструкции для IE 7 <![endif]-->

Для IE 6:

<!--[if IE 6]> Инструкции для IE 6 <![endif]-->

Тем же самим способом можно сделать і для остальных версий:

<!--[if IE]> Инструкции для Internet Explorer <![endif]-->
<!--[if IE 5]> Инструкции для IE 5 <![endif]-->
<!--[if IE 5.0]> Инструкции для IE 5.0 <![endif]-->
<!--[if IE 5.5]> Инструкции для IE 5.5 <![endif]-->
Способ №2

Не всем нравится использовать в шаблоне условные комментарии, для вас способ №2.
Мы редактрируем CSS файл. Например делаем кроссбраузерным класс p:

p{
color: #000;
color : black; /* для IE8 и ниже - на всякий случай */
*color: grey; /* для IE7 и ниже */
_color: blue; /* для E6 и ниже */
}

Удвоенные отступы

p{
: right;
margin-right: 25px;
}

Я думаю это самый частый баг в IE, связанный с параметром float. Для приведенного выше примера IE6 удвоит отступ справа. Это можно исправить, добавив параметр display:inline, используя один из выше приведенных вариантов.

Игнорирование внутренних отступов у кнопок:
Internet Explorer 6//7 игнорирует padding. Этот баг устраняют добавлением параметра overflow:visible для нужной кнопки.

Собственно, лекарств очень-очень много, а подробнее о всех багах IE можно узнать на сайте: www.positioniseverything.net

Один комментарий
  1. Иван Cheshir:

    А по русски есть где нибудь?
    На ie настолько все плохо что даже непонятно что именно сломалось )))
    и может можно писать тогда просто color : black;
    или тогда нормальные браузеры будут глючить?