.background-div {

background-image: url(”image.png”);

background-repeat: no-repeat;

background-position: left;

}

5.6

By percentage

Defining the image’s position by percentage is used to outline how far away from the corresponding edge the image must be. If we look at a typical div element, the far left side would be 0 per cent, and the far right would be 100 per cent, thus 50 per cent is in the direct centre of the div and 75 per cent is three-quarters of the way along the div. The same system applies for the vertical measurement as well. 0 per cent is the top of the div, 100 per cent is the bottom of the div. You can quickly see how much control over our image’s placement this gives us in a very easy to use way. By contrast, positioning a standard image element can be particularly cumbersome at times.