White-labelling with CSS

White-labelling with CSS

Met a nice man called Mark Panay at a company in Bristol last week and he kindly asked me to do some CSS for a white-label system he’s developed.

It’s always fun to put the standards-based stuff to the test on a real commercial system with real-world limitations and a stroppy client (actually, Mark couldn’t have been more charming, but you know what I mean). Luckily, these guys had done a nice job of writing stripped-out semantic XHTML. The system has a few different parts and my only concern was that certain logical objects get redefined rather that simply re-used so the style sheet was a little longer than it needed to be. Browser spec requirement was Mozilla-like on PC and Mac, with IE6 on WinXP and Safari on OSX. Finally, the stylesheet had to override (if necessary) a ‘base’ stylesheet that was used to display:none; some parts of the document…

The system is now live over at http://www.twocultureclash.com except I don’t think they’ve got their Futuresplash designer to update his 200 Megabyte .swf file so in the meantime, here’s a Javascript popup window. Try turning stylesheets on and off for extra edification or amusement (if you’re a sad web-designery-type-person…)

I’ve always found overflow:scroll to be a source of considerable grief and have usually coded around it, but it seems to work quite well here… queue irate comments from Opera users ;-)