background-position
Name: background-position
Description: Used to specify the position of a background image.
Browser Compatibility: IE 4+ / NN 6
Inherited: No
Values:
- inherit
- [length] (i.e., 2em)
- [percentage] (i.e., 35%)
- top left
- top center
- top right
- center left
- center center
- center right
- bottom left
- bottom center
- bottom right
Code Examples:
body {background-image: url(/img/graphic.jpg) top center;}
body {
background-image: url(/img/graphic.jpg);
background-repeat: no-repeat;
background-position: 30% 80%;
}
body {
background-image: url(/img/graphic.jpg);
background-repeat: no-repeat;
background-position: 30% 80%;
}
Comments: Used in conjunction with the background-image
property.
The two values refer to the horizontal and vertical position, in that order. If only one value is given, it's used for the horizontal value. The vertical value is then set at 50%, or centered. The values can be mixed, i.e., length and percentage used together.