Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

More important than !important (a higher level !important)?

The title says most of it. Is there a CSS keyword which overrides !important at one higher level or is there some feature like this planned in any newer CSS spec?

Of course, I know that !important is a bit likely to be used by noobs and that in many cases it is not the best way to go as stylesheets may really suck if badly written. However, sometimes it's useful and even needed.

The strongest style in CSS I can think of is an inline style with !important like this:

<span id="bluebeaver" style="color: red !important;">I am a happy blue beaver</span>

Now let's assume that I cannot edit the HTML and must modify the style from an external stylesheet.

It would be really great to have something like:

#bluebeaver {
    color: blue !important 2;
}

If they had levels for it like for instance with z-index.

Is there any solution to this or anything planned with newer CSS specifications? So far I did not find anything.

Can you show a CSS solution to override an !important inline style or is there definitely no possibility?

like image 777
Blackbam Avatar asked Feb 08 '17 18:02

Blackbam


1 Answers

Simply remove the style attribute from the element using JavaScript:

document.getElementById("bluebeaver").removeAttribute('style');

Then use your external stylesheet to apply whatever CSS you want.


Two reasons why creating higher levels of !important is not a good idea:

  1. It sets a bad precedent.

    Adding !important2 would be caving in to poor-coding habits on a global scale. It would be the W3C sending a signal that anything goes.

    You've also opened the door to !important3, !important4, etc. Where does it end?

    Lowering standards and expectations is not a good way for the industry to make progress.

  2. It may not even solve your problem.

    Consider this: The person who set that inline style to color: red !important, obviously wanted that rule to have the highest priority.

    If your idea became real, and there were higher levels of !important, let's say going up to !important10, guess what that person would have used? And you'd still have the same problem, but you'd be here asking if there were any plans for !important11.

like image 166
Michael Benjamin Avatar answered Oct 03 '22 00:10

Michael Benjamin