Q:

CSS Background-Position not working in .class

Recentley tried to make a spritesheet with css and classes for some icons. and found that the css class doesn't work with background-position but ID does now can someone explain me why it does that.
My Actual code. I typed the my question to fast and made some mistakes sorry for that.
This doesnt work
.male {
    height: 286px;
    width: 110px;
    background-position: 0px 0px;
}

.defender {
    background: url('../images/classes/human_defender.png');
}
<div class="male defender"></div>

But when i change the icon1 to an id like so it does work
#male {
    height: 286px;
    width: 110px;
    background-position: 0px 0px;
}

.defender {
    background: url('../images/classes/human_defender.png');
}
<div class="defender" id="male"></div>

A:

.class {
url('backgroundimageurl');
}

should be
.class {background-image:url(backgroundimageurl);}

