!important and inline stylesMore for the “yet another thing I would’ve already known if I’d bothered to read the spec” file: you can override inline styling — including <font> tags — from a CSS stylesheet.
A rule’s precedence is determined by its specificity, and an inline style’s specificity is very high. But !important rules take precedence over everything.
If stuck with HTML like this, for example:
<p style="font-color: pink;">I love pink!</p>
It’s still possible to override it with an !important rule:
p {
/* I hate pink. */
color: black !important;
}
And yes, it even works with <font> elements. If faced by some ghastly, antediluvian monstrosity of a web-page, a hideous Lovecraftian twisting-together of content and presentation newly crawled from a dark pit at the far edge of the Web –
<p><font color="pink">Pink! And Ponies!</font></p>
– it can be easily dealt with:
font {
color: black !important;
}
Or, with a browser capable of more advanced selections…
font[color="pink"] {
color: black !important;
}
It doesn’t seem like a particularly useful thing to know, but it’s a godsend for styling other people’s nasty HTML. In my case, the particular problem was that LiveJournal’s dynamically-generated quick-reply form contains this:
<table style="border: 1px solid black;">
Dealing with S2 is bad enough without further frustration on the CSS front, and I really hated that border. Hooray for !important!
Wow. Here I a stopped by to see about the little diff system you cooked up for the versioning plugin and low and behold I actually learn something new about CSS! Personally, that’s why I never read the specs. People like you do and then blog about it
All hail sloth!