Return to tstme

This is my Basic CSS Box Model Demo, inspired by the good Jon Hicks.

Basically, drag the scrolly thing, and you get to see the padding/margins thing in faux-3D.

The W3C diagram looks like this

I first fully understood the box model when I saw this page at Brain Jar. To date, that is the best demonstration of how this all should work that I've seen. Read it all.

Normally I would do this sort of stuff in a nice XHTML 1.0 document, but I'm being a tad lax at the moment. Find me a browser where it doesn't work and I migh think about an update!

IE, as you would expect, likes to be the individual. That's a nice way of saying it doesn't handle borders the same as everyone else. This only really matters if you are doing dashed borders, and you probably shouldn't be using them anyway because they are ugly! But regardless, here is the info you need to get them working: Tom's site.

Best of luck,
Douglas

Other stuff you can see at tstme:
CSS Rollovers
Some full height columns
Some CSS rounded corners