Overriding !important


in the following snippet I would like to override ‘color property’ which is ‘locked’ with !important. How could I fix it?

login #nav a, .login #backtoblog a {

color: #21759B!important;




  • Timothy
    • Chief Pigeon

    !important should really be a last resort, some designers/developers don’t always use it that way.

    When its overly used the issue comes when you need to overrule another instance. The key is Cascading and how you declare the CSS.

    So… You’ll need to remove the original !important or call the CSS in a different order.

    The last rule used will rule all.

    Take care.

  • Shawn
    • The Crimson Coder

    CSS is based on distinctiveness. Adding even one tag above the existing CSS along with the !important will override it. Here’s an example:

    body div login #nav a, body div.login #backtoblog a {
    color: #f00 !important;

    This is more distinctive, so it will override the previous !important call.

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.