Skip to Content

!important a použití hacků v IE

Klauzule !important zvyšuje prioritu nějakého pravidla uvnitř kaskády ve stylech. Kaskáda funguje tak, že každému pravidlu přiděluje různou míru důležitosti. Je tomu tak například u více různých hodnot jedné vlastnosti přidělené nějakému prvku. Slovo important svým překladem vystihuje svoji úlohu - určuje nejvyšší prioritu ve stylech.

Příklad:
p {
color: #ff0000 !important;
color: #000000;
}

Zde bude odstavec červený, (ne však v IE, vysvětlení dále v textu) jelikož prohlížeče berou v potaz vlastnost s touto direktivou jako přednostní.
Pokud by ale slovo !important v našem příkladu nebylo, bude odstavec pro všechny prohlížeče černě zbarvený. Styly jsou aplikovány v pořadí, jak budou čteny prohlížečem. To znamená, že pokud se zobrazí první z nich v horní části dokumentu a pak se změní, bude použit ten změněný. Pokud mají dvě pravidla stejnou specifičnost, má přednost pravidlo, které je definované jako poslední.
Vlastnost !important se také používá (nebo využívá?) i jako možnost, jak napsat kód, který ovlivní jen určitý prohlížeč, obecně to nazýváme „hackem˝.

Hack !important je založen na faktu, že prohlížeč Internet Explorer ve všech jeho verzích bude celou deklaraci, která používá tuto prioritní vlastnost ignorovat a použije tu druhou. Tento hack je validní, i když většina hacků těží vlastně z chyb nějakého prohlížeče.

Stejným způsobem ale (zřejmě) nevalidním funguje i podtržítkový hack. Používá se také v zápisu CSS a slouží k tomu samému účelu.
Vlastnost, která začíná podtržítkem bude IE hodnotit jako by zde žádný takový znak navíc nebyl a dané pravidlo aplikuje. Ostatní prohlížeče toto však netoleruje.

Příklad:
#blok {
padding: 0px;
_padding: 10px;
}

IE tomuto bloku přidělí vnitřní odsazení 10px, v ostatních prohlížečích nebude žádné.
Místo podtržítka také můžeme použít i jiné znaky, například znak $, pořád ale zůstává dokument nevalidní.
Dalším způsobem, jak ošetřit nedokonalosti IE je tzv. „Holly Hack˝, kde se před názvy tříd, ID atd., vkládá znak * a značka html.

Příklad:
#obsah {
width: 205px;
}

*html #obsah {
width: 200px;
}

MSIE dává přednost té vlastnosti, která se nachází ve zmíněném označení.
Existují hacky i pro jiné prohlížeče, ale v běžné praxi nejsou tolik potřeba.