Oh CSS, why do you hate me so?

Just so you know: this page was imported from my old blog. Some pages were rather mangled in the process; my apologies if things don't quite look right.

You would have thought web design would be a simple job - you tell a web browser what colour your text and background is going to be, and what size, and you're pretty much sorted, right?

Uhhm, no such luck.

I've just lost a couple of hours of my life trying to fix a problem with the menus right across UPSU.net which I caused when I switched the menu system over from a table-based layout (i.e. bad for screen readers) to a list-based layout (i.e. gooood for screen readers) - 99% of the viewing population won't ever notice this change, or at least that was the plan.

Unfortunately, Internet Explorer - God bless it - had other ideas, and promptly broke the menus across the whole site, leaving double-spaced gaps below every single menu item.


So I've just been experimenting with box model hacks (apparently a bit of a bad idea without completely changing the way we import our stylesheets, as most box model hacks have nasty effects on NN), and have ended up modifying a bit of code from A List Apart's excellent Taming Lists tutorial.

Of course, I'm expecting something else on the site to break as a result now...

I think I'm going to start on a re-working of our whole CSS system shortly - while the CSS generator is working well (averaging a 30% cut in stylesheet size), the underlying CSS sheets need some tidying up - after a year of tweaking, extending and redesigning, they're all looking a little the worse for wear. Any requests? Or, even better, anyone fancy helping me tidy up the code?

Most-mentioned in the blog