Опубликовано: 12.05.2011 Последняя правка: 08.12.2015

CSS хаки для браузеров

CSS хаки для браузеров — это определенные CSS-конструкции, которые понимают только конкретные браузеры или вообще только их отдельные версии. Область применения хаков — это кроссбраузерная верстка сайта.

Не секрет, что многие (особенно старые) браузеры не понимают некоторые псевдоэлементы, свойства CSS, их значения и так далее. Более того, браузеры вполне могут понимать какое-то свойство, вот только трактовать его не так, как все. Соответственно получается, что если для всех браузеров использовать единую таблицу стилей (CSS), то сайт может выглядеть в некоторых из них по-своему. Чтобы избежать подобных проблем как раз и используются CSS хаки, с их помощью можно добавить какие-то стили в общую таблицу, но сделать так, чтобы понимали их только избранные браузеры или браузер.

Хотелось бы добавить, что CSS хаки для браузеров — это не очень хорошо по нескольким причинам:

Абсолютно большую часть языка CSS все популярные браузеры понимают одинаково, поэтому в некоторых случаях применение хаков — это не необходимость, а просто недостаточная опытность верстальщика.
Некоторые хаки не проходят валидацию синтаксиса CSS.
Отдельные CSS хаки могут провоцировать излишнюю нагрузку на компьютер пользователя, причем совсем не обязательно в тех браузерах, для которых они предназначены.
Новые версии браузеров могут начать игнорировать некоторые хаки, которые они раньше понимали. Естественно, если на момент применения хака, его и так понимали только старые версии, то данной проблемы не будет.
Ситуация обратная предыдущей. Новые версии браузеров могут начать понимать хаки, которые им не предназначены. Например, использовался CSS хак для Opera, а новая версия Firefox его тоже смогла распознать, соответственно приходится менять стили или HTML-код.

И все же иногда без хаков просто не обойтись, особенно, если верстаешь под старые версии браузеров.

CSS хаки для разных браузеров

CSS хаки для Opera: Хаки для браузера Opera.
CSS хаки для Firefox: Хаки для браузера Firefox.
CSS хаки для Chrome и Safari: Хаки для браузеров Chrome и Safari.
CSS хаки для IE: Хаки для браузера Internet Explorer.
Условные комментарии IE: Условные комментарии для IE. Они не имеют прямого отношения к CSS, скорее даже это HTML, но именно условные комментарии использует большинство верстальщиков вместо «прямых» хаков, когда речь идет о подгонке верстки под Internet Explorer.