Liquid Layout


I think I finally got the HTML / CSS of my site laid out the way that I want. Specifically, a liquid / dynamic layout that will scale as you resize the browser window. - Go ahead, try it. - See? - I know, it's nice!

I first cut my teeth on HTML in the late '90s, but I've never really had to do much with it on a professional level. I'd only occasionally have to look at someone else's HTML and tweak it, or something else minuscule, but never anything large. What few different sites I'd dabbled in, were table based. Yes, I know, shame on me. But in my defense, that was around '02, before CSS had matured.

So, when I decided to resurrect my site from /dev/null, I decided that I'd try to follow current (X)HTML and CSS standards. Not surprisingly, things had changed quite a bit since the last time I worked on more than one page. I had always liked how I could have a dynamic site using tables, and was having trouble re-producing that with CSS. That was until I sat down and did some concerted searching / playing / testing last night. While searching, I found Pagecolumn which helped me immensely. I was able to play with the HTML / CSS from their 2 column liquid fixed layout and get it to do what you see here. One things I did differently was change all the measurements to be in "em"s rather than "px"s. Call me crazy, but I like the idea and want my layout to be relative to the size font you, the reader, choose, not what I, the webmaster, specify.