0

I have referred this post but wasn't able to figure out how to apply separate background position property for the two images.This is my css properties

css{ background-image: url('...img1.png'), url('....img2.png');
background-position: 0;
background-repeat: repeat,no-repeat;
background-size: 14%;
}

i want to be able to apply separate values for background-position and background-size property without property on one image affect the position and size of the other image.

To be specific, i want image one have default value for background-position while image 2 has property right-bottom

also the size of background image 2 to be 10%.

i have tried doing this but it seems to affect the properties of other background-image.What am I doing wrong?

Community
  • 1
  • 1
Nigel
  • 387
  • 4
  • 13

1 Answers1

0

you can set different position and size for both images

background-position: top left, top right;
background-size:100px,200px;
Ankit Agrawal
  • 6,034
  • 6
  • 25
  • 49
  • thanks for the reply, but i did some playing with the properties and 'background-position-x:value1,value2' and 'background-position-y:value1,value2' seems to give more control. – Nigel Sep 08 '13 at 07:30