If you want a copyright message that sits at the bottom of one of your columns or at the bottom of the page you can use absolute positioning to place it there.
As absolute elements are removed from the flow you need to preserve the space that the element occupies so that content doesn't over-write it. You can do this simply by using padding on the element above so that the space the absolute element occupies is protected.
The only drawback is that the absolute element does have to be a specific height so that you can account for the amount of padding you will need to protect it. Usually this isn't a problem with copyright messages and the like because they are just one or 2 lines of text.
You can of course use ems for the padding so that when text is resized the padding is also increased so that the layout stays intact.
First of all you need to create a local stacking context by applying position:relative to the main outer. This will allow further positioned elements to take their starting position from this main outer rather than the viewport.
#outer{
position:relative;/* stacking context so that we can place copyright at the bottom of the page*/
}
You may thing that you need to apply this positioning to the column you are interested in but you would be wrong. Only the main outer will always contain the full height of the page so that is the one we must use to base our absolute element on.
Next we simply place the element absolutely at the bottom:
#copyright{
position:absolute;
bottom:0;
left:0;
width:200px;
}
The element has been placed at the bottom of where the left column would be and therefore we have given it the same width as the left column to complete the illusion
Then we must preserve the space at the bottom of the left column
#left{
padding-bottom:4em;/* preserve space for copyright message*/
}
You can use trial and error to work out exactly much padding you need or if you are good at maths then work it out exactly. You must remember that the space is at the bottom of the left float and as the content extends the left float downwards then it will always stop before the content reaches the bottom because you have applied padding to stop it.
Of course you could place the copyright message anywhere at the bottom on whatever side you like as long as you follow the example above.
View source for the full code as the code is in the head for this demonstration.
This is the left content and to stop this content overwriting our little copyright message we need to apply some padding to the bottom of this element so that it protects the absolute element at the bottom. Of course this means that we have to work with fixed heights for the text that goes at the bottom but for things like copyright messages that isn't usually a problem.
This is the copyright message...
© 2006 info....