Using CSS for layouts lacks some of the controls designers crave.
One especially unpopular "feature" is the multi-column situation and the difficulty getting the columns to all extend to the bottom of the page. There are many sites with discussions and tips on dealing with this problem. Some of the solutions work, but not with all browsers. It is interesting to read about these CSS hacks; you'll pick up a lot of street smarts.
Use a background image and position it using percentages; while setting DIV widths with percentages, also.
The inspiration for this trick comes from Dan Cederholm, and restated on the I Love Jack Daniels site. Visit it for lots of fun tips.
The sidebar at the right has the steps to follow.
Use one of your logo exercises as the topic. Create your own graphic for the background, put together a page using this technique. It can be as simple as this page, or you can add parts if you dare.
You create a page with a container DIV, and two DIVs inside the container.
You set the widths with percentages.
You create a background image with left and right areas to serve as the background.
Where the background divides is determined by your master plan for the DIVs in the layout. This page has the columns set for 67% and 33%, for a total of 100%. These live in the Container, which is 80% of the browser's viewport.
The background image is 1200 pixels wide; split at the 800/400 horizontal point.
The background is used in the CONTAINER and its position is set by the percentage method, and set to repeat on the Y axis. You are placing the image into the container; the container contains the two DIVs used as columns, and they inherit the split-image background.
See the article in I Love Jack Daniels.
The percentage values have to align. A 60% column (a DIV) aligns with the background image at the 60% point in its width. This image could be any width, but you need to place the visual break at 60% of the width. (Of course, you will use any width percentage you need for your layout.)