I'm trying to have 3 columns on my page to go 100% of the page height.
The two methods I've tried to use is
float: left;
and
display: table-cell;
The 2nd option makes it so the 3 columns stretch all the same size, but the problem is it only matches the content inside of it.
The first option makes it so that only the main content div is 100%, but the outside columns only match the viewport of the browser.
table cell: http://imgur.com/e3aAS.jpg
float: http://imgur.com/K9NpH
I've tried searching already and I've gotten a few answer for what seems to be similar situations so I'm not exactly sure how to approach this or if theres a cheat.
Thanks for the help.
|