Having trouble with positioning element to bottom

HTML & CSS
1

Hiya,

i’m trying to position an element to the bottom of a page using css.

I have used a jquery plugin which resizes my image to fit the whole of the browser.

I’ve looked around found that setting

position:absolute
bottom:0px

should work if using within a parent.

but im having no luck. any ideas?

here is a link to my site im having problems with http://alsweet.co.uk/

you can see the element i want to be at the bottom appearing in the top right…

thankyou, alsweet

2

Hi, Welcome to SitePoint! :slight_smile:

You need to get the 100% height set on your html element too. You currently have it set on the body only.

You will need to remove the default margin/padding from the body so it does not create a scrollbar.

You need to get rid of that colon that is after the anchor (a:)

This should get you squared away -


[B]body,html[/B] { [COLOR=Blue]height: 100%;[/COLOR] }

[B]body[/B] {
[COLOR=Blue]    margin:0;
    padding:0;[/COLOR]
    color:#FFF;
    font-family: Tahoma, Geneva, sans-serif;
}

[B]a [/B]{
    color: white;
    text-decoration: none;
    font-family: Arial, Helvetica, sans-serif;
}
3

thanks a lot Rayzur, worked a treat :smiley: