Admin Life Errors, Fixes, and Encounters

css fixed background image

One interesting thing to do with websites it to have a fixed background image. Even if the user scrolls up and down the background stays in place. This can add a nice effect if the background has a fade effect.

How is this done? Easily with CSS.
All you need to do is 4 things, add the following to your CSS file.

body {
background-image:url(/images/background.jpg);
background-attachment: fixed;
background-repeat:repeat-x;
background-position:bottom;
}

"background-image" is the image you want to use.
"background-attachment" fixes the image to the screen.
"background-repeat" this makes the image repeat via the x-axis (left to right)
"background-position:" where should the image be? in our case, the bottom of the screen.

That's it.