CSS » CSS без правил


30 апреля 2008 от admin
К сожалению, многие браузеры (не будем показывать пальцем кто именно) до сих пор некорректно трактуют казалось бы, полностью валидный код. Немного погуглив и почитав форумы и блоги, я нашел несколько интересных вариантов решения проблем "несовместимости".

Да, я снова буду "ругать" ИЕ. Но не только ругать - покажу, как можно заставить его подружиться с валидным кодом и использовать его недостатки в своих целях.

Трентон Мосс (Trenton Moss) предлагает для этого использовать !important. Связано это с тем, что если правил CSS несколько, браузерs отдают предпочтение последнему. Все, кроме ИЕ. Благодаря этому мы можем указывать персональные стили 4 IE only - например, в случае с кодом:
background-color: #FF0000; !important; background-color: #00FF00;
во всех браузерах фон будет красным, а в ИЕ - зеленым.

А вот Роджер Джохансон (Roger Johansson) советует для ИЕ использовать условные комментарии CSS.
Все, что находится между
<!--[if IE]> и <![endif]-->
предназначено исключительно для браузеров от Microsoft.
Например, код:
<link rel="stylesheet" type="text/css" href="style.css" />
<!--[if IE]>
<link rel="stylesheet" type="text/css" href="ie.css" /> 
<![endif]-->
загрузит один файл со стилями для Мозилла/Опера/Сафари/Конкверор, и совсем другой файл для Интернет Эксплорера.

И еще один совет от Роджера - если хотите работать с em как с px, установите font-size для тега body 62.5% а размер шрифта по умолчанию сделайте 16px.