The code you gave works, it just does not do what you want it to. It assumes you want to the page to stop at the bottom of the browser, which is not what you asked for.
There are many examples out there of how to do with with css, such as the faux column technique, but that assumes your left column will always be smaller than your right. It's quite simple once you understand how it works. You have a container, with a
background of say red. Then you put two divs in the container, well call them leftdiv and rightdiv. leftdiv will contain your menu and either no background, or the same background as the container, and rightdiv will have a different background. You can
float leftdiv, and rightdiv, but then make sure you put overflow:hidden on the container so that it will expand to contain the heights of both divs.
Marked as answer by Kensino on May 14, 2012 06:42 PM
Motley
Star
13789 Points
2449 Posts
MVP
Re: Vertical Columns
May 14, 2012 05:16 PM|LINK
The code you gave works, it just does not do what you want it to. It assumes you want to the page to stop at the bottom of the browser, which is not what you asked for.
There are many examples out there of how to do with with css, such as the faux column technique, but that assumes your left column will always be smaller than your right. It's quite simple once you understand how it works. You have a container, with a background of say red. Then you put two divs in the container, well call them leftdiv and rightdiv. leftdiv will contain your menu and either no background, or the same background as the container, and rightdiv will have a different background. You can float leftdiv, and rightdiv, but then make sure you put overflow:hidden on the container so that it will expand to contain the heights of both divs.