image at bottom of screen ? how ?

ChicoMendez · 18-02-2008 12:59pm #1

Hi

im building a webpage and i want to put an image at the bottom of the screen - not the bottom of the page - and when we scroll down the page the image stays at the bottom of the browser screen

anyone know how i do that ?

thanks

aidan_walsh · 18-02-2008 1:00pm

Little CSS magic.

body
{
background-image:url('smiley.gif');
background-repeat:no-repeat;
background-attachment:fixed;
background-position:bottom;
}

seamus · 18-02-2008 1:01pm

Check out CSS positioning and using the "static" option.

Goodshape · 18-02-2008 1:14pm

a different bit of CSS magic :

CSS:

#bottom-div {
    position : static;
    bottom : 0px;
    height : 100px;
    width : 100&#37;;
}

HTML :

<div id="bottom">Look at me! I'm at the bottom!</div>

...a little bit more flexible than aidan_walsh's example, I think (you can ensure that it sits above the content, for one thing)... but both have similar results.

Webmonkey · 18-02-2008 1:32pm

Goodshape wrote: »
a different bit of CSS magic :

CSS:
#bottom-div {
    position : static;
    bottom : 0px;
    height : 100px;
    width : 100&#37;;
}
HTML :
<div id="bottom">Look at me! I'm at the bottom!</div>
...a little bit more flexible than aidan_walsh's example, I think (you can ensure that it sits above the content, for one thing)... but both have similar results.

+1

aidan_walsh · 18-02-2008 1:51pm

Goodshape wrote: »
a different bit of CSS magic :

CSS:
#bottom-div {
    position : static;
    bottom : 0px;
    height : 100px;
    width : 100&#37;;
}
HTML :
<div id="bottom">Look at me! I'm at the bottom!</div>
...a little bit more flexible than aidan_walsh's example, I think (you can ensure that it sits above the content, for one thing)... but both have similar results.

True that. Belted out that example fairly quick between calls at work

image at bottom of screen ? how ?

Comments