В помощь верстальщику: Статьи - Как подружить CSS и IE6
Количество багов, которые «всплывают» при реализации CSS в InternetExplorer 6 версии, не может не поражать. А верстальщикам, которым для верстки сайта порой приходится невероятно ухищряться, они до боли знакомы. Для нейтрализации этих багов были разработаны специальные правила – «хаки». Их приходится применять, когда никак иначе уже не справиться с этой «непрямой» программой. Что весьма неприятно засоряет код, ненужный другим браузерам, но автоматически подгружаемый ими. Ведь для верстки сайта под Firefox и Opera таких проблем не возникает, а значит, и «хаки» им не нужны.
Как спрятать «хак» и уберечь «хорошие» браузеры от лишнего кода? Первый шаг – верстка сайта вообще без «хаков», только после этого выявляются места, где без них совсем никак, и только в этих местах «хаки» ставятся.
Второй шаг – использование conditional comments. IE, начиная с 5 версии, поддерживает это решение. С помощью такого комментария:
<link href="style.css" rel="stylesheet" type="text/css" media="all" />
<!--[if IE]><link rel="stylesheet" type="text/css" href="ie.css" media="all"/><![endif]-->
вы убережете все браузеры, кроме IE, от прочтения лишнего кода. Во второй строке прямо написано, что читать ее стоит только, «если IE».
Возьмем довольно распространенный «хак»:
#element {
position:relative; /* Основное правило для всеx браузеров */
}
* HTML #element {
position:static; /* Переопределение правила для IE младше седьмой версии */
}
и «спрячем» его в отдельный файл style.css:
style.css:
#element {
position:relative; /* Основное правило для всеx браузеров */
}
ie.css:
#element {
position:static; /* Переопределение правила для IE всех версий */
}
Результат – максимально положительный из возможных (в идеале бы вообще «хаков» не было). Валидная верстка сайта, упрощенный код, сокращение объема загружаемого кода для не-IE браузеров.
<< Назад