Not all characters of embedded font displaying

[eggheadbooks1]

I have embedded a font specifically to add some Wingding-like characters into my ebook. The font is a Unicode TTF developed by Google. When I type in the Unicode character codes into Sigil, most appear as expected. But when I open the ePub in ADE, only one of five are displaying; the rest are the typical empty boxes.

When I convert to Kindle, all appear.

However, I then tested some other characters but they are not displaying in Sigil, ADE, or Kindle.

I'm stumped. I thought the point of embedding fonts was to work around the character limitations of ebooks/ereaders. I also assumed -- clearly wrongly -- that if a character appears in the embedded font itself then the character will display in the ebook.

I have checked the ePub in IDPF's online ePub check to be sure I didn't mess up the code; all passes.

Are there limitations to embedded fonts that I am not aware of?

[DiapDealer]

Have you verified the the embedded fonts are actually being displayed at all (in the scenarios where certain characters aren't displaying in ADE)? One CSS syntax error could keep embedded fonts from working and wouldn't be picked up by the IDPF validator.

That would explain why the characters might display on a Kindle, but not in ADE (different system fonts with different extended character support.

Make sure your css validates.

Also note that some rare/broken fonts are not suitable for embedding and being displayed properly in ADE. There is a particular property of a font that can be problematic if it doesn't have a certain value, if I recall.

[eggheadbooks1]

Originally Posted by DiapDealer

Have you verified the the embedded fonts are actually being displayed at all (in the scenarios where certain characters aren't displaying in ADE)? One CSS syntax error could keep embedded fonts from working and wouldn't be picked up by the IDPF validator.

That would explain why the characters might display on a Kindle, but not in ADE (different system fonts with different extended character support.

Make sure your css validates.

To test my usual code, I took an older ebook with a font embedded and added a character that I know is NOT in that font, and got the expected empty box. I then also removed the reference to the font for the particular character that I had used the font for, and the character disappeared. So it seems the code in my previous ebook works fine.

The CSS is this new one is the same format:

@font-face
	{font-family:"NotoSansSymbols2-Regular.ttf";
         font-style:normal;
         font-weight: normal;
	src:url("../Fonts/NotoSansSymbols2-Regular.ttf");}
p.CClock
	{margin:0;
	text-align:center;
	text-indent:0;
	font-size:5em;
	font-family:NotoSansSymbols2-Regular;
	}

I have also tried this:

{font-family:"NotoSansSymbols2-Regular.ttf";
	src:url("../Fonts/NotoSansSymbols2-Regular.ttf");}

When I validate the CSS, I get this error:
2 Value Error : font-family Property font-family doesn't exist in CSS level 2.1 but exists in [css1, css2, css3] : "NotoSansSymbols2-Regular.ttf"
3 Property src doesn't exist : url("../Fonts/NotoSansSymbols2-Regular.ttf")

but that error has been showing up for all embedded fonts in Sigil, at least in my experience.

(Sorry for the glitches -- the post keeps posting when I try to fix the code.)

[DiapDealer]

That css error can probably be safely ignored. But if you're using the Sigil tool to validate your css, though, you can double-check by setting the default css level to 3.0 for epub2s in the general Sigil preferences and check again.

If you have fontforge, or some other font editing software, you can also check the OS/2 version property of the font. If it's not version 3 or lower, it probably won't work right with ADE.

[DiapDealer]

Also, don't use the file extension for the font-family name. It shouldn't really matter what you use, but it must match -- exactly -- the font-family name of the paragraph class you're trying to assign it to.

You're using:

font-family:"NotoSansSymbols2-Regular.ttf"

for the @font-face statement, and:

font-family:"NotoSansSymbols2-Regular"

for the CClock class.

Use:

font-family:"NotoSansSymbols2-Regular"

for both.

Your src url is fine (as long as the fonts have actually been added to the Sigil epub).

[eggheadbooks1]

Originally Posted by DiapDealer

Use:

font-family:"NotoSansSymbols2-Regular"

for both.

Your src url is fine (as long as the fonts have actually been added to the Sigil epub).

Ah -hah! That's me being sloppy! Didn't notice the file extension that was NOT supposed to be there. All works fine now. Thanks. It was those characters that WERE displaying that was leading me into thinking my code was fine. Not.

Also, changed my settings in Sigil to check to CSS3 and the font error has disappeared.

Thanks very much.

[DiapDealer]

No problem!