No replies
Zebra123's picture
Last seen: 9 years 38 weeks ago
Timezone: GMT+1
Joined: 2012-11-20
Posts: 1
Points: 2


I'm having a hard time figuring out something that should be ridiculously easy. I have this site consisting of a wrapper, and inside the wrapper there are two columns. The left column is a classical menu, while the actual content of the page goes in the right column. The content varies from page to page, and while some articles are long, others are short. What I want is a minimum height on the page equal to the height of the users screen, but the page height should also expand with the content under the circumstances of an overflow.

My immediate solution to this was to simply assign min-height: 100%; to both columns and the wrapper, as well as the html and body tags. While this works in Opera, other browsers don’t seem to be getting it right. There's no problem when the content of one of the columns are greater than the screen length. However, when there's not enough content to fill the page, the two columns either won't align with each other, or they won't apply the min-height of 100%.

I can't imagine this being especially hard of you just knows the trick, so if anybody could point me in the right direction it would be greatly appreciated.