Weblog entries posted on this day.
It all started with a photo that I made in a bathroom at the Royal Academy of Arts. The picture shows me, taking a picture of myself via a mirror, using a lot of flash. On the mirror, the word heaven
is pasted (probably by another student for some sort of project). The photo has been the inspiration for various personal site designs.
It started out with a simple page that was build up with table hacks and an iframe, at a subdomain of fragile minds dot com. The design you're currently looking at (assuming you use a graphic browser, did not apply a nalternate or cutom style sheet, and it's still April 2004) is called Mirror to Heaven 5
, but a name like Mirror to Heaven 24.6 revision 85
would probably be more accurate. Blah.
Something I've been meaning to do since the first implimentation of a Mirror to Heaven theme on my previous home page is to break down the code and explain its features and the the choices I made. It's one of the most flexible/elastic style sheets I've created (or seen, for that matter).
The flexibility/elasticity comes from the fact that everything but pixel based images is linked to initial the font size, and even that initial font size is relative to the the setting of the user agent (x-small). Not only the paragraphs and headers are directly linked to the font-size, but also the dimensions of containers and even the thickness of borders. The only thing that is not relative are the dimensions of pixel based images (img); simply because the results would be ugly (vector based images like SVG are relative also).
Another nice thing about this theme is that every browser can handle it. Sure, you need to run the latest Mozilla + SVG build to see all the fancy CSS trickery, but it will also display perfectly well if you do not. I've tested the site in Internet Explorer on Windows, Opera, Netscape 2 to 7 (yes, that includes Netscape 4.7x!), and many others, at various screen resolutions and various font size settings. Here are some screenshots:
Ok, now that you've seen what I'm talking about, let's break down the code.
This day, elsewhere.