A Promising Beginning

A brand new blog, a brand new outlet for ranting about life the universe and everything. But don't worry, rants needn't be negative. I am well and truely capable of rambling on about exciting and happy things going on in my life. For example...

I totally just had an HTML success. Sounds too good to be true, I know. I've built a couple of websites in my life, some have even made it onto the actual interwebs. I've grown from a table-happy n00b to a major div hog, I'm even trying to break the unscalable-pixel-defined-layout habbit. Throughout my adventures with divs, there's always been one thing I couldn't get my layout to do: fill the height of a window nicely with a properly positioned header and footer and expanding content within.

And this is how I did it:

<html>
<body>
<div class="container">
<div class="innerContainer">
<div class="header"></div>
<div class="content">
//Main site content goes in here. If using "float"ed elements, stick a .clear div before closing the content div.
</div>
<div class="clear"></div>
</div>
<div class="footer"> </div footer>
</div>
</div>
</body>
</html>

with css:

html{ height:100%}
body{height:100%}
.container{min-height:100%}
.innerContainer{height:100%}
.footer{position:relative; top:-50px;  height:50px; }
.clear{clear:both}

And I think that's all. It took me a while to find a combination of divs with the right heights to pull this off. While writing it out, I may have missed the random step that actually makes it work. I hope not.

And with that, a blog is born.

Tagged: code