And I didn't even set the line height anywhere else, so I was surprised that it had any effect, because I thought 1 would be the standard. This directive supports both icon fonts and SVG icons, but not bitmap-based formats (png, jpg. I already tried changing the line height property to 1, and while that does reduce the space at the bottom, it's still not even. The span inside the button is 24 x 24, but the button content is not.Īs you can see, when inspected, there's some more space underneath the plus than above it, which makes the button not quadratic as I would like it. The button and icon class have no special styles applied to them, other than a color change, but for some reason the content of the button is way taller than it's wide (24 x 29.xxx if I remember correctly, with a font size of 24 px). The second problem I have is that I used an icon for a button (the ligature way, since that's the only one that I got to work), and it's not quadratic.
#Google icons code#
I tried &#xxxx just like in the example, with the code that's given under "Code Point" for each icon in place of the x, but that doesn't work. However, I don't understand how these numeric character references work. That's great and all, but since it apparently doesn't work in all browsers, I wanted to try the other method that's mentioned:įor browsers that do not support ligatures, fall back to specifying the icons using numeric character references So I'm using Google Icons on a website I'm writing, and I have two problems:Īs it says in the documentation right here, you can use a span element with the correct class and just put the icon name inside, and it'll work.
0 kommentar(er)
