Creating Sprites

Instructions ⇋

1. Enter Width for desired sprite
2. Enter Height for desired sprite
3. Enter Image URL
4. Click "Show"
5. Place Crosshairs in upper left section of image to define starting point of sprite
6. Click
7. Copy contents in "SET" section to the "background:" attribute
8. Create Sprite like so:
   <style> #sprite { width:100px;max-width:100px;height:150px;background:url(https://css.netcentrx.net/cards/playing-cards-v4.png) -196px -148px no-repeat; } </style> <div id="sprite"></div>