I know this question is an old one but having researched and tried and tried for 2 days now i am still not having any luck and I hope someone here could give me some advice!

Problem:

I have a page that i need to apply a sticky footer, simple normally but here's where i'm having the problem.

I can get the footer div(#footer) to stick to the bottom with out a problem (it's 100% width with a repeating background image) Then within this DIV I float another(#cut) with a bg-image to the right( the scissors in my example). This also works fine.

The problem is that I need another 100% width div(#footer-link-wrap) below the primary one so that I can float some nav links(#links) in the centre. Within the #footer-link-wrap i need another image floated all the way to the right, tried doing this with a positioned background but i can't get it to work.

I've totally hit a wall and I would greatly appreciate any feedback, i've just getting back into design after a long break and it's probably me making a silly mistake.

Hi, that's exactly where i got the original code from, it works fine with the single DIV but i'm stumped when it comes to multiple DIV's
–
tcnarssNov 1 '10 at 19:35

Its not the solution, but maybe it could help you. Your image on #footer-link-wrap doesn't seem to show because the height of #footer-link-wrap is too small. Try changing the margin-top and height to 100 px and you can see it.
–
yvoyerNov 1 '10 at 19:53

Does it look like what you wanted With a clear:both on #footer-link-wrap?
–
yvoyerNov 1 '10 at 20:03

In #footer-link-wrap the image is only 40px high so that should be enough. The clear:both on #footer-link-wrap has moved the DIV under #footer(in FF,Crome & Opera) but the lower is displayed off the page i.e. you have to scroll to see it. In IE6 #footer-link-wrap still displays above the #footer div. Thank you for you're help so far, we're getting there!
–
tcnarssNov 2 '10 at 9:46