How do I lay out a fixed two-column page using CSS?
Jun.16, 2007 in
CSS
Henry J asked:
I want to create a web page that will have anywhere from one to 4 four columns per page. These article columns will be inside a div container that will be centered. I do not want my articles to flow or move around and I will be placing images in the articles as well.
How do I do this? The tutorials I find always have the second column float and move around. I do not want any liquidity.
Please include the full code – I am new to css and a simple comment will not help me much.
Custom Search
June 18th, 2007 at 5:07 pm
Please buy and use one or more of the cited texts. I have them and use them constantly. They also cite many standard and endlessly useful websites!!!
June 19th, 2007 at 10:51 pm
The float property will cause quite a bit of “liquidity” on your pages. What you’ll want to do instead is set your columns positioned absolutely with the position command. The easiest way to do this is to create a container div that is set to position: relative, and then position divs inside the container with an absolute position and using the top/left/right commands to place it.
This concept is a little tricky at first, but gets easier every time you do it. A good page that outlines what I mentioned can be found here: — But as mentioned above, it might be prudent to pick up a quick book and read through it.