August 6, 2012

using multiple image on background

Question by Diwash Regmi

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 by Starx

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.

Author: Nabin Nepal (Starx)

Hello, I am Nabin Nepal and you can call me Starx. This is my blog where write about my life and my involvements. I am a Software Developer, A Cyclist and a Realist. I hope you will find my blog interesting. Follow me on Google+

...

Please fill the form - I will response as fast as I can!