I am trying to use the background-image & background-position in my css. The Image part works, but I am having issues with the background-position.

My bg-image is a sprite image, and I use the position to focus on a specific part of the sprite. It does not seem to work at all with negative values for x & y.

.my-sprite{
background-image:url('~/images/bg-sprite.png');
background-position: -36 -120;
}

Just to test, I also tried to use center/center but it still did not move

.my-sprite{
background-image:url('~/images/bg-sprite.png');
background-position: center center;
}

My guess is it cannot move the bg-image outside the screen bounds?