I don't know which one to use. I know when I use background-image: that's the only time I can use the other commands like background-position.

 

Which one should I sue and why? Does one take presidence over the other?

background: is the shorthand

 

Wheras background-image, is just the image part.

 

.element{
Background: #000 url(image.png) no-repeat 50px 50px
}

 

or

 

.element{
Background-color: #000;
Background-image: url(image.png);
Background-repeat:no-repeat;
Background-position:50px 50px
}

With the latter you take up less lines of code which is a bonus. Although they'll both achieve the same results, and both are perfectly valid in the eyes of the W3C.

 

Chris

Background-image: is easier to read.