Understanding how to use image sprites

HTML & CSS
37

You were close, try swapping you BG positions around.
If I understand right, you want the top blue portion of the sprite showing as the default state

.playButtonb {
    background-position: 0 0;
 }

.playButtonb.active {
    background-position: 0 -260px;
 }

Be aware that the class name .active can easily be confused with pseudo :active
Try to select class names that don’t conflict with established html/css elements and properties

1 Like
Class name active/activated placement