Background-Position

Description

The background-position property gives the position of a background image.

The background-position declaration tells the browser where to position a background image. The property accepts three kinds of values: keywords, pixels and percentages, values that may be mixed.

The only incompatibility problem is that Mozilla 1.6 and Opera 7.50 refuse to honour a combination of a keyword value and a pixel or percentage value. Explorer and Safari have no problems with these combinations.

When you use only pixels and percentages, the first value denotes the left position, the second one the top position

Inherited: no

Typically Used For

Sets the starting position of a background image.

Values For The Property

top left

top center

top right

center left

center center

center right

bottom left

bottom center

bottom right

x% y%

Example

body { background-image: url(stars.gif); background-repeat: no-repeat; background-position: top left }

body { background-image: url(stars.gif); background-repeat: no-repeat; background-position: 0% 0% }

Resources

http://htmlhelp.com/reference/css/color-background/background-position.html

http://www.w3schools.com/css/pr_background-position.asp

http://www.quirksmode.org/css/backgroundposition.html