I was intrigued by the banner at the bottom of the webpage of the WMPoweruser web site: http://wmpoweruser.com/. So I experimented with Dreamweaver and played with some CSS. After some trials, I found a solution that is simple to implement:
#banner {
height: 100px;
width: 640px;
position: fixed;
bottom: 0px;
background-image: url(bannerImage.png);
}
With the above CSS, the banner always stays at bottom of the page, whether the page is resized or scrolled. Note that I used png as the background image because I like to have a bit of transparency effect to see behind the banner.
Try this out. It is easy. Tested with both IE 8 and Google Chrome.
By Brian Chau
Comments (3)
Created
April 24, 2010

IE6 doesn’t support position:fixed;
Is not just what the css specs says? what’s new?
Great article,Thank you for sharing.It was good and outrageous to know such truth.Advanced Technology