Wednesday 14 August 2002
The markover to end all markovers
Mark Pilgrim points to Michael Barrish’s Oblivio as the latest site to undergo a markover. And what a markover! I’d love to see before and after screen dumps because Michael has done something remarkable—the new (CSS) design is a dead ringer for the old (table hack). Not that it was easy:
…I began from how hard I thought everything would be, multiplied this by the usual you-know-things-never-go-as-planned factor, then multiplied this by a no-seriously-it’s-going-to-harder-still factor, and still came nowhere close to imagining the horrors ahead.
One assumes that Movable Type, “pound-for-pound the best personal web publishing system ever,” assisted in the transformation of a totally impossible task into one that was merely excruciatingly difficult.
Permalink
I've found that recreating table designs precisely in CSS is a lot easier if you use fixed width / fixed font sizes and absolute positioning. I recently attempted an unofficial markover of http://www.sitepoint.com 's new front page design as an exercise and ended up with something that looked visually almost identical (see http://development.incutio.com/simon/css-experiments/sitepoint/new2.html ). It ends up feeling like a bit of a cheat though (especially the pixel font sizes) so for "real" (as opposed to experimental) sites I intend to keep things fluid and resizable. At any rate, while redoing table designs in CSS is a great way to practise half of the fun of CSS is it lets us break away from the limitations of table based design.
Michael insisted on a fixed width for the inner (content) column. I tried to talk him out of it but he has his reasons. I did get him to use relative font sizes, though.
If we'd only get browser support for max-width there wouldn't be any need for fixed-width content columns, dang it.
This discussion is now closed. My thanks to everyone who contributed.
© Copyright 2002-2003 Jonathon Delacour
I've found that recreating table designs precisely in CSS is a lot easier if you use fixed width / fixed font sizes and absolute positioning. I recently attempted an unofficial markover of http://www.sitepoint.com 's new front page design as an exercise and ended up with something that looked visually almost identical (see http://development.incutio.com/simon/css-experiments/sitepoint/new2.html ). It ends up feeling like a bit of a cheat though (especially the pixel font sizes) so for "real" (as opposed to experimental) sites I intend to keep things fluid and resizable. At any rate, while redoing table designs in CSS is a great way to practise half of the fun of CSS is it lets us break away from the limitations of table based design.
Posted by: Simon Willison on 14 August 2002 at 11:37 PM