CSS Footer

[Tomi-gwc]

Hello, I'm learning to code in XHTML/CSS. So far, (my first coding project) I have this: http://jrcdesigns.co.uk/test/Leafy/index.html

The problem I am having is getting the footer image (The Leafy thing at the bottom) to be at the bottom. Right now it is set to absolute positioning, however this is just a short term fix that I am not happy with.

How can I have the footer not positioned absolute, with 100% width at the bottom of the page?

I have tried putting it outside the container however doing this makes it appear near the top of the page. :o

Any ideas?

 

[silverdown]

Looks like you have the image CSS position

position:absolute;

try

position:relative;

I am not sure this will work since I cannot test it out myself. However it is worth a try. Then just add

width:100%;

for the width above or under Position. I hope it works for you!

 

[user-7256]

For your div#leaf styles, do:

position: absolute;
bottom: 0px;
z-index: 10;
width: 100%;

(make z-index value greater than the z-indexes of all other divs)

Maybe want to add a padding:0px or margin:0px or both if you still have issues.

EDIT: I know you said you don't want absolute positioning, but I'm assuming you want them to be at the bottom... if you positioned relative, it would be stuck to the bottom of the content and not the frame and it would look kinda bad...

 

[spyke100]

--- Post Deleted