W CSS do każdej pary “właściwość : wartość” programista może dopisać atrybut !important. Jest to właściwość, która nadpisuje wszystkie inne style dostępne na stronie (nawet jeśli te są wpisane inline’owo w pliku HTML) i nadaje im najwyższy priorytet. Czy jest to dobry zwyczaj, czy raczej należy go unikać?

Otóż jest to bardzo zła i nielubiana praktyka. Niekiedy nie ma możliwości jej uniknięcia, ale jeśli znajdziesz sposób ani zapisać dany styl bez użycia !important, zrób to! Używanie sporej ilości importantów w kodzie zaburza naturalne dziedziczenie styli, a ewentualne szukanie błędu staje się trudniejsze. Kiedy więc można użyć !important?

Najbardziej praktycznym i popularnym scenariuszem użycia tego atrybutu jest nadpisanie styli pochodzących z danego pluginu lub skryptu jQuery, którego używamy na stronie. jQuery jest to biblioteka w Javascriptcie, która ułatwia nam modyfikowanie strony bez jej przeładowania. Służy więc też do wszelkich animacji i zmian wyglądu poszczególnych elementów na stronie. Niestety wszystkie dodane style dopisuje inline’owo w kodzie HTML. W tym wypadku gdy dany skrypt jQuery wykonuje niepożądaną rzecz na naszej stronie możemy napisać własne style, do których właśnie dodamy atrybut !important, aby napisać to co robi jQuery.

Niekiedy także spotkamy się z kodem posiadającym własne style CSS zapisane inline’owo, który musimy dodać na stronie. Przykładem są np. programy partnerskie czy skrypty do analizy ruchu na stronie. Wyświetlają one często jakiś baner lub logo danej firmy i często posiadają własne style. Niejednokrotnie możemy nadpisać te style w pliku HTML, lecz niekiedy style te również są dodawane w Javascripcie i nie unikniemy nadpisania ich poprzez atrybut !important. Pamiętaj jednak, że często ukrycie takiego baneru skutkuje złym działaniem skryptu. Warto więc po prostu dobrze ostylować element tak, aby współgrał z resztą witryny.

Nie należy także przesadzać w drugą stronę. Niekiedy powyższy atrybut będzie dla nas ogromną oszczędnością czasu i nie należy nadpisywać bardzo głęboko zagnieżdżonych styli tylko po to, by nie użyć !important. Jeśli jesteśmy świadomymi programistami musimy ocenić poświęcony czas na rozwiązanie problemu oraz konsekwencje metod których możemy użyć. Nie należy za wszelką cenę omijać atrybutu !important i pisać długie łańcuchy wszystkich elementów po kolei, aż do docelowego. Podstawowych poziomów zagnieżdżeń mamy aż 16, co bardzo dobrze obrazuje grafika dostępna tutaj.

Podsumowując atrybut !important nie jest dobrą praktyką przy pisaniu styli, lecz czasami nie jesteśmy w stanie go pominąć. Należy określić czas potrzebny na rozwiązanie problemu i konsekwencje jakie ciągnie za sobą użycie atrybutu. Często także tylko w ten sposób możemy nadpisać style, które są dodawane inline’owo przez różnorakie skrypty Javascript.

Szukasz kursu CSS? Sprawdź nasz kurs css dla początkujących.