[Solved] Glyph from icomoon is not working in pseudo-element

[fooman]

Hi!
I uploaded a font to icomoon.io and generated a font I planned on using with pseudo-elements. Arrow icons and such. No biggie.

It tells me the character is “g”. It also says I can use \67. I do that and I see a glyph I’m not expecting.

I try to use the HTML entity version hardcoded on the page itself to see if it’s work (g). It does!

Can anyone shed any light on what my issue might be? I feel it’s probably a huge oversight on my part :(

[shaneisme]

Can you set up a CodePen example for us? I’m sure it’s something simple.

[Paulie_D]

I don’t think you can use decimal unicode in pseudo-elements.

I think it’s only ASCII, text and HTML entities.

MDN says…

non-latin characters must be encoded e.g. \00A0 for ` `

But if you know it maps to ‘g’ surely it’s simpler just to use that….why complicate matters?

Still looking for a definitive answer though.

EDIT: This suggests Hex Unicode is Ok

https://css-tricks.com/css-content/

[fooman]

Ok, get ready to throw punches at me :(

Turns out… the parent element had a text-transform: uppercase; property on it and I didn’t clue in until now.

AHHHHHHHHH!!!!! I face-palmed myself pretty hard on this one.

[Author]

Posts