Thanks to Theo Spears awesome effort premailer now support CSS specificity. What that means is that when linked and inline CSS blocks are transformed into tag style attributes the order is preserved as you'd expect.

When the browser applies CSS to elements it does it in a specific order. For example if you have this CSS:


p.tag { color: blue; }
p { color: red; }

and this HTML:


<p>Regular text</p>
<p class="tag">Special text</p>

the browser knows to draw the first paragraph tag in red and the second paragraph in red. It does that because p.tag is more specific that p.

Before, it would just blindly take each selector and set it as a style tag like this:


<p style="color:red">Regular text</p>
<p style="color:blue; color:red" class="tag">Special text</p>

which is not what you want.

The code in action is here.

Thanks Theo!

Your email will never ever be published.

Previous:
HTML whitespace "compression" - don't bother! March 11, 2013 Web development
Next:
Never put external Javascript in the <head> April 2, 2013 Web development
Related by category:
Claude Opus is 10x faster than OpenAI GPT 5 at non-streaming completions July 24, 2026 Python
Best Django Redis configuration for speed and size July 19, 2026 Python
How to use a list/tuple/array in Django with a raw SQL cursor July 14, 2026 Python
Using AI to rewrite blog post comments November 12, 2025 Python
Related by keyword:
Premailer.io July 8, 2015 Python, Web development, AngularJS, JavaScript
How to use premailer as a command line script July 13, 2012 Python
premailer.py - Transform CSS into line style attributes with lxml.html July 11, 2009 Python
premailer now with 100% test coverage August 22, 2014 Python