CSS Tuesday: Overide Inline Style

How many times have you worked with either someone else’s code or some crazy dynamically generated code that uses inline styles for everything which you need to change or override but cannot for some reason or another? I have seen this a lot with custom applications written by programmers who think they are doing designers some sort of favor.

Something that I recently found that will allow you to override inline styles:

<p style="margin:20px">The inline style (style=) will give the paragraph a 20px margin.</p>

Let’s override that because I think 20px is overkill and I only have access to the stylesheet:

p[style] {margin:10px !important;}

Of course that will override any paragraph tag that has an inline style – but you can see where this is going.

Reference: http://css-tricks.com/override-inline-styles-with-css/