CSS background-position Property Example

Updated on August 17, 2015     Kisan Patel

The CSS background-position property sets the starting position of a background image for an HTML element.

Syntax

background-position: top;
background-position: bottom;
background-position: left;
background-position: right;
background-position: center;
background-position: 100px 5px;

Example

body {
  background-image: url("../image/background.jpg");
  background-position: center;
  background-repeat: no-repeat;
}

Lets take another example. In this example, the background image 45px from the right and 20px from the bottom of the container.

body {
   background-image: url("../images/bg.jpg");
   background-position: right 45px bottom 20px;
   background-repeat: no-repeat;
}