В принципе, при публикации данного рода статей необходимо большими буквами писать, что ИСПОЛЬЗОВАНИЕ ХАКОВ ВРЕДИТ ВАЛИДНОСТИ ВАШЕГО САЙТА! Однако бывают ситуации, когда использование данных средств оправдано, в особенности это касается верстки для Internet Explorer (хорошо хоть с восьмеркой попроще...), но иногда бывает необходимо создать особое правило и для нормальных браузеров. Это бывает редко, но к этому надо быть готовым. В этой статье, которую я нашел на одном из заокенских блогов мы рассмотрим CSS хаки для различных версий Firefox.

Некоторые из этих CSS хаки не валидны, другие являются проприетарными, а некоторые из них полностью валидны (в зависимости от спецификации CSS). Эти Firefox хаки организованы в соответствии с номером версии браузера и полностью готовы к использованию через копи-паст:). Но есть несколько примечаний применимых ко всем хакам, которые описаны в этой статье:

• Для каждого хака, изменяйте только селектор #selector, .selector, и, конечно, декларации блоков.
• Хаки, которые не валидны, обозначены знаком [!] в соответствующем комментарии.
• Если вы обнаружите какие-либо противоречия, несоответствия, пожалуйста, оставьте комментарий.
• Эта статья может быть дополнена вашими хаками, которые не описаны здесь. Пожалуйста, в комменты!

Также имейте в виду, что в целом есть два вида CSS хаков: нацеленные (таргетированные) и фильтры. Под нацеленными, мы имеем в виду применение стилей CSS к конкретному браузер (или группе браузеров) при исключении всех других. И наоборот, под фильтрацией, мы имеем в виду применение стилей CSS для каждого браузера, кроме определенного браузера (или группы браузеров). В сущности, хаки представляют собой две стороны одной медали.

CSS хаки таргетированные на любую версию Firefox

/* Target all Firefox */
#selector[id=selector] { color: red; }
 
/* Target all Firefox */ 
@-moz-document url-prefix() { .selector { color: red; } } 
 
/* Target all Gecko (includes Firefox) */
*>.selector { color: red; }

CSS хаки для Firefox 1.5 и выше

/* Target Firefox 1.5 and newer [!] */
.selector, x:-moz-any-link, x:only-child { color: red; }

CSS хаки для Firefox 2.0 и выше

/* Target Firefox 2 and older [!] */
body:empty .selector { color: red; }
 
/* Target Firefox 2 and older */
#selector[id=SELECTOR] { color: red; }
 
/* Target FireFox 2 and older [!] */
html>/**/body .selector, x:-moz-any-link { color: red; }

CSS хаки для Firefox 3 и, возможно, выше

/* Target FireFox 3 [!] */
html>/**/body .selector, x:-moz-any-link, x:default { color: red; }

Если у вас есть свои хаки для всех или конкретных версий Firefox то, пожалуйста, добавляйте их в комментарии.

P.S. — мысли о продажах и комфорте...

Казалось бы каким образом может быть связана кухонная вытяжка в одессе с модными часами и семинарами по маркетингу? А может. Например как вытяжка так и часики tag replica — это предметы которые добавляют нам комфорта, а семинар по маркетингу — это неотъемлемый атрибут успешного развития тех людей, которые взялись продавать нам комфорт. Странно да! Продавать комфорт!

• Aleko says:

  сентября 30, 2009 at 14:42

  Вот здесь я специально собрал проверенную отличную подборку css хаков. Надеюсь вам поможет: css хаки. В том числе я нашел (написал) хаки для хрома и ie8.

  Reply