CSS is easy, right? We tell people that, even though the principles involved in tables for layout can be learned in half an hour and never need to be upgraded.
As I tell my not-infrequent critics, if you don’t like some part of the appearance of my Web “properties,” it’s almost certainly because I don’t know how to do any better. I am sometimes embarrassed by that, but most of the time I live with this damning self-indictment reasonably well. I’m an expert in enough obscure fields. Do I also need Bowmanesque facility with CSS, too?
No. I don’t. And these sites are proof of it.
Nevertheless, shit happens. I’ve made a resolution to “transition,” rather like a confused male on hormones, to HTML 4.01 Strict for ’06. I’m going for markup purity and exempting myself from the XHTML discussion altogether. Hot, right? So very, very hot.
I’m putting together basic all-purpose stylesheets for the little text-only documents I have sitting around (by the hundreds, in fact). Yes, my shit is unexciting to look at, so what I want is a nice new CSS that respects such a reality. I do want a cute little graphical header here and there:
And I want that to be a link back to the homepage. Obviously I don’t want borders or underlines or any of that nonsense. Simple, right? a img { border: none; text-decoration: none; }.
But of course that doesn’t work. Because of my pluperfect link specifications (:link and :visited and :hover and :active and usually also :focus), I kept getting an underline or a blue background on hover. (Just the whole discussion of fine-tuning hover effects blows IE6 out of the water anyway, given that it all but fails to understand the concept.)
Anyway, that’s also simple, right? Just add !important. Well, that didn’t work, either.
Add classes to things? Like .headerimage-left a:link img, perhaps. Oh, but if I’m doing that, I also have to do the other link pseudoclasses. So that’s six or eight entries right there if I include not only *-left but *-centre.
And that didn’t work, either.
So at this point I get Rohgare Johansson on the line. And we can’t get it totally right, either. This is causing me agitation.
- joeclark
- I keep telling you this is not easy to fix.
- RogerJohansson
- and I’m not going to give up
Admirable, certainly. But later we do give up. On a lark I ping Featherstone, who discovers that you just can’t trust specificity these days and you have to declare every last thing: div.headerimage-left a.nothing:hover { background-color: #fff; }.
Yeah. So that was like an hour and a half working on something that’s supposed to be rudimentary. And the result? Well, it’s my reading list, and it looks just like a text-only page circa 1999, except maybe with nicer fonts.
(Incidentally, this personal Weblog will remain XHTML Transitional into the indefinite future, as that is a WordPress default that is too difficult to change. It would be interesting for someone to develop a plug-in to migrate Transitional to Strict markup, which, in homage to Brian Eno, could be named the Before and After Science plug-in.)