Question

OK this is fairly complicated to explain so I’ve put it online here:

http://jsfiddle.net/zSgPr/10/

I need the yellow container to wrap around the lower brown div and red footer div in this set-up, leaving the footer at the bottom of the page, ideally where I can then adjust it by pixel margins. I have tried multiple ways of clearing it with some luck, however I can’t figure out how to get the footer to behave or the content to encapsulate properly. Could somebody suggest a means of doing it? Thanks guys.

This is what I am trying to achieve

Answer:

Was overlooking the obvious that I needed another container div. If anyone wants to see it’s on-line here: http://jsfiddle.net/zSgPr/21/

Answer 1

Add bottom:0 to .textbox

Plcace the .textbox div outside the container which means when you are giving position:absolute the parent div should have Position:relative so add relative to main div which is .page

LIVE DEMO

SOLUTION