M
M
maolo2015-04-18 19:55:44
Icons
maolo, 2015-04-18 19:55:44

How to correctly set the size of the icon for the font?

I can't find any articles that show how to draw an icon correctly, nor can I find the right parameters myself so that the icon is aligned to the baseline in all browsers.
What I managed to more or less pick up is on a 32x32 canvas, but I still have to position the icon at +1px, i.e.:

.icon:before {
position: relative;
top: 1px;
}

8d2fda19d58d428281c5d70d4c2ef3ae.png
I downloaded svg from fontawesome - I did not see any pattern.
I tried, as in some fontawesome icons, to use 28x28 with an indent of 2px (I tried both above and below) - different offsets are obtained in FF and Chrome, if one is perfect, then it is offset in the other, and vice versa. Do they manually position each icon there?
Tell me please. how to properly mark canvas?
PS I used Icomoon and Fontcustom to build fonts

Answer the question

In order to leave comments, you need to log in

1 answer(s)
M
maolo, 2015-05-04
@maolo

Found the answer here :
those. the indent from the bottom should be 1/8 of the height of the canvas, i.e. for a 512px icon, the indent from the bottom will be 64px, and the height of the image itself will be 448px.
d5805e5ff3664ca78ced25b4720e624f.png

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question