CODEWITHSUNDEEP
htmlcssgradient
Shivam Chopra
Shivam Chopra

Reputation: 639

Cannot understand the syntax of background position?

I am learning design patterns using gradients in CSS3. But stuck up with something which I cannot able to understand how it works. Actually, I am trying to understand patterns through the blog post of Lea Verou: Link.

Now, there's one pattern i.e., checkbox pattern CheckBox Pattern Demo.

There is a background-position: 0 0, 50px 50px; set in its CSS.

As far as I know we can set top right bottom left inside background position but they are set without comma separation.

So, Can anyone explain me how this exactly background-position works what else we can do with background position as this is something new. I only use to set image from CSS Sprites as of earlier but this is something new.

Thanks in advance !!!

Upvotes: 0

Views: 47

Answers (1)

Giovanni Silveira
Giovanni Silveira

Reputation: 1281

background-position: 0 0, 50px 50px; is setting the value of the position for 2 different backgrounds. If you look at the sample, you will see that background-image actually has 2 sets of the same background.

Upvotes: 1

Related Questions