Bar always on bottom

Hi, I'd like to create a bar that is always at the bottom of the screen for the screen resolution of 1024x768 amd if possible all screen sizes.

So far the solutions I found manage this but if the contents of a page are long enough so that you have to scroll down, you can only see the bar at the bottom once you have scrolled down fully.

However I would like a bar that stays at the bottom of what can be seen even if you have to scroll down to see the rest of the contents of the page.

So in effect the bar always hovers at the bottom of the screen above everything. Does anyone have any solutions?

Use a position fixed and have the width be 100% you would have to move it to the bottom of the page but I've done it this way before

#bottombar{
position:fixed;
top:98%;
left:0;
z-index:10;
}

Thanks for that, it works perfectly on resolutions.

I also tried to get an image to be dead center of the page, but the position of it changes when you change the resolution of the screen to a widescreen resolution.

Any help with getting a div or picture dead center on a page?

#pic{
position:absolute;
top:50%;
left:50%;
}

that should get it close there is an article on sitepoint that explains quite a bit about some strange positioning behaviors that you may want to look up and read