CSS CSS Image Sprites

Help us to keep this website almost Ad Free! It takes only 10 seconds of your time:
> Step 1: Go view our video on YouTube: EF Core Bulk Extensions
> Step 2: And Like the video. BONUS: You can also share it!


  • //Using background-position
    background: url("sprite-image.png");
    background-position: -20px 50px;
  • //Background property shorthand
    background: url("sprite-image.png") -20px 50px;


For some use cases, sprites are slowly falling out of favor, being replaced by icon webfonts or SVG images.

Got any CSS Question?