image at bottom of screen ? how ?

ChicoMendez · 18-02-2008 11:59AM #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 12:00PM

Little CSS magic.

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

seamus · 18-02-2008 12:01PM

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

Goodshape · 18-02-2008 12: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 12: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 12: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