The !important flag must be placed at the end of the declaration, immediately before the semicolon, otherwise it will not be taken into account by the browser.

Noncompliant Code Example

.mybox {
  width: !important 100px;
  border: 1px solid !important black;
}

Compliant Solution

.mybox {
  width: 100px !important;
  border: 1px solid black !important;
}

Exceptions

!default and !global flags are allowed after the !important flag. The following piece of code does not raise any issue:

$var1: 10px !important !global;
$var2: 10px !important !default;