Copyright with CSS

Hi,
I'm having a bit of trouble :?

I've got a title, content, footer design that is giving me pain. You see the title is a set height, that is fine, but the content isn't, it all depends on the page.

Now the thing is I would like a bit of copyright text to sit right at the bottom of the page on every page, I can do this with:

bottom: 0px;
position: absolute;

The only problem is if the content text gets too big (and it will) and flows down the page the footer stays right at the edge of the page, sitting in the middle of the new extended content, I've tried it without the position: absolute; and it works, but if the content is small it sits right at the edge of the content again in the middle of the page, its a damned if I do, damned if I don't.

I'd rather I didn't have to give content a set height as I'm trying to cater to a wide range of resolutions and I don't like scroll bars showing up if they aren't needed.

I'm not sure if I'm writing this correctly, is its truly incomprehensible I'm sorry :?

can you paste your code?

Are you using CSS positioning elsewhere on the pge?

Basically, if you have long content like that, you need to create a series of containing blocks that all have absolute positions.

So, you need to create a pseudo frameset by having a content block whose bottom is set to the position of the copyright container's top attribute:

Hi,
My current code is:

BODY {
background:#FFFFFF;
height:100%;
margin:0px;
width:100%;
padding:0px;
min-width:500px;
}

#title{
background-image: url("../images/bgtop.jpg");
background-repeat:repeat-x;
width:100%;
min-width:500px;
height:150px;
padding:0px;
top:0px;
}

#title_menu{
background:#FFFFFF;
position: absolute;
right:52px;
top:90px;
vertical-align: text-bottom;
width:260px;
}

#title_right{
position: absolute;
right:0px;
top:0px;
width:52px;
}

#content{
width:auto;
padding:0px 10px 0px 10px;
min-width:500px;
}

#footer{
bottom:0px;
position: absolute;
}

MJEggertson,
I tried the code you posted but it didn't seam to want to work, the copyright bit still flowed over the content :?

http://www.alistapart.com/stories/flexiblelayouts/

I have used this story for a similar thing, Using Container DIVs and nesting DIVs inside with Relative and Absolute positioning.

The story explains how to create a three column layout in CSS with a bottom area.

The script mentioned in the article determines the size of the content div and then sets the bottom area to the bottom of that..

Give it a try..