It’s possible to override in-line CSS with CSS from a user style sheet. By default, CSS styling set in a HTML document takes precedence over a user style sheet. However, we can overcome this by using the !important keyword.
The following HTML example has a in-line CSS style to set the width to 100px.
Normally to style the table element, we’d use the following:
However, as the style is set in-line, the in-line CSS style takes precedence over our style sheet.
We can get around this by using !important keyword, as follows:
This now tells CSS that our ‘width’ rule takes precedence over the in-line defined style.
More information on the !important keyword and CSS inheritance can be found in the W3 CSS Specification.