OK - my CSS skills are creeping slowly forward. Now what I've run into is that I need to lengthen a couple of columns that have very little content in them to be the same as a column that has more content in it. In my example page:
<!-- m --><a class="postlink" href="http://www.cultivatedesign.org/ecor/test.html">http://www.cultivatedesign.org/ecor/test.html</a><!-- m -->
the central column is the longest. In some cases on this site that won't be the case - sometimes the central content will be quite short and the left or right column will determine the page length. The green bar at the bottom of course should snug up against all three columns.
I do have all three in a single div - it contains two divs: one for the left column and one for the center/right column, the latter of which contains further divs to create the center and right columns. So if I can just stretch all these divs to the bottom of the enclosing div I should be OK.
What's a good approach to this? I've seen tips about getting columns to stretch the height of the page, but not something like this.
On another matter, notice how the Search box up top is sitting a bit low. Seems to have a margin above it (and below if I set the div height to auto) - though the style for that form field has margins (and padding) of zero. Also tried setting the padding for the div it's inside to zero. Is there something else I should change to get this form field to move up?
- <!-- m --><a class="postlink" href="Bobhttp://www.alistapart.com/articles/fauxcolumns/">Bobhttp://www.alistapart.com/articles/fauxcolumns/</a><!-- m -->
<!-- m --><a class="postlink" href="http://www.stunicholls.myby.co.uk/layouts/threecol.htmlAh">http://www.stunicholls.myby.co.uk/layou ... col.htmlAh</a><!-- m --> - that Stu Nichols one did the trick - thanks!
The List Apart one would probably be great if my columns extended all the way to the bottom of the page - but they don't.
<!-- m --><a class="postlink" href="http://www.cultivatedesign.org/ecor/test.html">http://www.cultivatedesign.org/ecor/test.html</a><!-- m -->
the central column is the longest. In some cases on this site that won't be the case - sometimes the central content will be quite short and the left or right column will determine the page length. The green bar at the bottom of course should snug up against all three columns.
I do have all three in a single div - it contains two divs: one for the left column and one for the center/right column, the latter of which contains further divs to create the center and right columns. So if I can just stretch all these divs to the bottom of the enclosing div I should be OK.
What's a good approach to this? I've seen tips about getting columns to stretch the height of the page, but not something like this.
On another matter, notice how the Search box up top is sitting a bit low. Seems to have a margin above it (and below if I set the div height to auto) - though the style for that form field has margins (and padding) of zero. Also tried setting the padding for the div it's inside to zero. Is there something else I should change to get this form field to move up?
- <!-- m --><a class="postlink" href="Bobhttp://www.alistapart.com/articles/fauxcolumns/">Bobhttp://www.alistapart.com/articles/fauxcolumns/</a><!-- m -->
<!-- m --><a class="postlink" href="http://www.stunicholls.myby.co.uk/layouts/threecol.htmlAh">http://www.stunicholls.myby.co.uk/layou ... col.htmlAh</a><!-- m --> - that Stu Nichols one did the trick - thanks!
The List Apart one would probably be great if my columns extended all the way to the bottom of the page - but they don't.