shakyShane / gulp-svg-sprites

Create SVG sprites or compile to <symbols>
MIT License
334 stars 45 forks source link

Minimal font-size in Chrome is 12px by default #39

Closed eokic closed 8 years ago

eokic commented 10 years ago

Not sure how this is supposed to work with font-size scaling. Chrome for example has minimal 12px font-size by default so the rendered icons look cropped (right and bottom edges are cut off): https://dl.dropboxusercontent.com/spa/1dqminp255vakv6/cgu20ie6.png

When I go to (Chrome) settings and set the minimal font-size to 10px it works as intended, but I leave it on 12px default purposely always, including when developing since this will be the default behaviour for most users.

I saw your plan to add the option to change the base font-size, but I'm not sure if this really is the way to go. Different clients / devices / user's preference (visually impaired) can influence this issue regardless of our "safe size asumptions" and then the sprite breaks again without any way for us to know or affect this.

paynecodes commented 10 years ago

Seeing the same issue here. I'm not sure what the fix is yet, but +1

elivz commented 9 years ago

I just submitted pull request #67, implementing a baseSize configuration option so that the font-size on .icon can be changed from 10px to a larger size.

stefanmaric commented 9 years ago

I find that in most cases an em-based size or inherit is a better approach. It can be easily achieved by overwriting .icon, but I think that it would be handy to able to set baseSize in any CSS unit.

Maybe I'm missing something and you may correct me. If not, I can work on it and send a pull request.

soenkekluth commented 8 years ago

just set the baseSize option and if needed load your own css template.