search

twolfson / spritesmith

Utility that takes sprites and converts them into a stylesheet and its coordinates
MIT License
916 stars 56 forks source link

Add padding around boundary area #63

Closed krimeshu closed 8 years ago

krimeshu commented 8 years ago

When I cut icon images align it's boundary, and then found display problems on some android devices browser. The sprite image looks like this: (dark area means padding of spritesmith) 01

So I have to keep another padding when I cut the images, to achieve the effect like that: 02

It's boring and not effective, could spritesmith help me add the boundary padding like that? It whill solve my big problem, thx~

twolfson commented 8 years ago

Could you elaborate on the problem you are encountering?

krimeshu commented 8 years ago

For example, the icon images might look like this: image And then join them into the sprites images: image The problem arises: image The yellow icon is in the right bottom corner, but it might mix up with the icon right top and left bottom.

twolfson commented 8 years ago

Ah, I see. Setting background-repeat: no-repeat in the CSS should resolve that. It's caused by scaling images and why we initially introduced padding as an option:

https://github.com/Ensighten/spritesmith/issues/7

krimeshu commented 8 years ago

Oh, I forgot adding it to my automatic tasks... Maybe this problem won't show on most android devices again, thank you!

twolfson commented 8 years ago

I'm glad that resolved that issue =)