Question

I am getting problems on using multiple images in the background of my web pages. I used the following codes for it:

body{
background-image: url(images/img1.png), url(images/img2.png); }

The code I used gives me two images on background but I want to keep one of the image exactly on the center. How can it do so using CSS?

Answer 1

Yeah, you can do it like this

body {
    background-image: url(images/img1.png), url(images/img2.png);
    background-repeat: no-repeat, repeat-x;
    background-position: center, top left;
}

Check a demo here.