css 3

Icon

A comprehensive CSS 3 reference guide, tutorial, and blog
Are you a CSS expert? Want to contribute? Contact us

CSS BACKGROUND-POSITION

The background-position property sets the starting position of a background image.
Inherited: No

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%
}

 

Possible Values

Value Description
top left      

top center

top right

center left

center center

center right

bottom left

bottom center

bottom right

If you only specify one keyword, the second value will be “center”.
x-% y-% The first value is the horizontal position and the second value is the vertical. The top left corner is 0% 0%. The right bottom corner is 100% 100%. If you only specify one value, the other value will be 50%.
x-pos y-pos The first value is the horizontal position and the second value is the vertical. The top left corner is 0 0. Units can be pixels (0px 0px) or any other CSS units. If you only specify one value, the other value will be 50%. You can mix % and positions.

 

 

3 Responses

  1. Fatbloke says:

    Cheers,
    This one solved a problem.

    Fats.

  2. hi all CSS experts,
    i want to change only vertical position of background image and remain the horizontal position i already set before.

    how can i do it:

    help asps
    thanks
    Nayana Adassuriya

  3. Lluis says:

    Background positioning: I would like to position an image to a div starting from the bottom left corner (default, top left corner), and move this bg image some pixels top,. allways having the image positioned absolutely from the bottom left corner.

    Is that possible? thank you so much.

Leave a Reply

Pages

Sponsors


CSS3.com



Please help CSS3.com stay alive and running

Bad Behavior has blocked 2309 access attempts in the last 7 days.