Just don't understand embedded fonts

[Jabby]

Rather than verbally explain my confusion, I've uploaded an epub file that I use to test results of coding changes. In it I have defined four font faces: ArialN, LiberationMono, LiberationSans and LiberationSerif each with bold, italic and bold-italic.

In the "body" I have defined "ArialN" as the font family. Every thing works as expected including bolding and italicization. If I change the font family the font changes but the bolding and italicization does not follow.

Can anybody tell me what I'm missing?

Please read my next post and disregard the attachment below.

Regards - John

P.S. Sorry, I didn't know the file was this big. Should have zipped it.

[JSWolf]

@font-face {
font-family: "ArialN";
font-style: normal;
font-weight: normal;
src:url(../Fonts/ArialN-Regular.ttf);
}
@font-face {
font-family: "ArialN";
font-style: normal;
font-weight: bold;
src:url(../Fonts/ArialN-Bold.ttf);
}
@font-face {
font-family: "ArialN";
font-style: italic;
font-weight: bold;
src:url(../Fonts/ArialN-BoldItalic.ttf);
}
@font-face {
font-family: "ArialN";
font-style: italic;
font-weight: normal;
src:url(../Fonts/ArialN-Italic.ttf);
}


That's what works.

[Jabby]

Originally Posted by JSWolf

That's what works.

Sorry I wasn't clear with my question. I'll try again.

I am uploading a new file with four chapters each with the same text and same exact same coding which is a mixture of bold and italic. The only difference between these chapters is that each uses a different font.

If you look at chapter 1 you will see the font style with the bolding and italicization. In all the other chapters you can see the font style change but not the bolding and italicization.

My question is why? It makes no sense to me and I am hoping that someone can enlighten me.

Regards - John

[yekim54]

Originally Posted by Jabby

If you look at chapter 1 you will see the font style with the bolding and italicization. In all the other chapters you can see the font style change but not the bolding and italicization.

My question is why? It makes no sense to me and I am hoping that someone can enlighten me.

The bold and italics look fine in the Sony Reader Library viewer. I think this is a problem with the Sigil viewer that has been previously discussed elsewhere in the Sigil forum.

[Jabby]

Originally Posted by yekim54

The bold and italics look fine in the Sony Reader Library viewer. I think this is a problem with the Sigil viewer that has been previously discussed elsewhere in the Sigil forum.

I had read that about the Sigil viewer and had decided to test the file against the PC version of Cool Reader, FB Reader, the Firefox Plug-in and the Calibre viewer. All failed in one way or another with Calibre being the closest. So much for standards.

I downloaded the Sony viewer and everything worked as you said. I suppose that means that the file is OK (95%?).

One thing that I just noticed. The calibre viewer and the Sigil viewer fail in exactly the same way. Makes me think that the Calibre viewer was the starting point for the Sigil viewer.

Regards - John

[theducks]

Originally Posted by Jabby

I had read that about the Sigil viewer and had decided to test the file against the PC version of Cool Reader, FB Reader, the Firefox Plug-in and the Calibre viewer. All failed in one way or another with Calibre being the closest. So much for standards.

I downloaded the Sony viewer and everything worked as you said. I suppose that means that the file is OK (95%?).

One thing that I just noticed. The calibre viewer and the Sigil viewer fail in exactly the same way. Makes me think that the Calibre viewer was the starting point for the Sigil viewer.

Regards - John

IIRC The core software for both viewers is the same(QTWebkit).

I was working on a section number (only) page:
Sigil renders a ADE can't center workaround too far Right.
Calibre, too far Right

ADE (on the reader), close to what I wanted
ADE on the PC, Perfect
EPUBReader (firefox), close

[crutledge]

I have been experienting trying to learn how to put fonts into Sigil with little luck. I obviously have no understanding of the process.

The following is at the head of the CSS.

@font-face {
	font-family: "Garfeld";
	font-style: normal;
	font-weight: bold;
	src:url(../Fonts/"GarfeldAntique Bold.ttf");
}

The call for the font is below in the CSS.

p, div {
	margin-top: 0;
	margin-bottom: .5em;
	margin-right: 0;
	margin-left: 0;
	text-indent: 1.5em;
	text-stye: bold;
	font-family:Garfeld,"Times New Roman", Times, serif;
}

The following is from the OPF.

<item href="Fonts/GarfeldAntique%20Bold.ttf" id="GarfeldAntiqueBold.ttf" media-type="application/x-font-ttf" />

The font is attached and was downloaded from a free site.
All this has no effect. Can someone point out mt errors?

[Jabby]

Originally Posted by theducks

IIRC The core software for both viewers is the same(QTWebkit).

I was working on a section number (only) page:
Sigil renders a ADE can't center workaround too far Right.
Calibre, too far Right

ADE (on the reader), close to what I wanted
ADE on the PC, Perfect
EPUBReader (firefox), close

Hi Ducks-
I had forgotten I even had the PC version of ADE, I use it so infrequently. It read my file perfectly as far as the fonts were concerned. It goofed me up when ADE wouldn't increase/decrease the font size because I had defined the font size as 16pt in the CSS. I had to go back and set it as "em's" to get it to work. As I said earlier - so much for standards.

Regards - John

[JSWolf]

But having pt is correct as far as keeping the font at a fixed size. em is a variable size and can change as needed.

[Jabby]

Originally Posted by crutledge

I have been experienting trying to learn how to put fonts into Sigil with little luck. I obviously have no understanding of the process.

The following is at the head of the CSS.

@font-face {
	font-family: "Garfeld";
	font-style: normal;
	font-weight: bold;
	src:url(../Fonts/"GarfeldAntique Bold.ttf");
}

The call for the font is below in the CSS.

p, div {
	margin-top: 0;
	margin-bottom: .5em;
	margin-right: 0;
	margin-left: 0;
	text-indent: 1.5em;
	text-stye: bold;
	font-family:Garfeld,"Times New Roman", Times, serif;
}

The following is from the OPF.

<item href="Fonts/GarfeldAntique%20Bold.ttf" id="GarfeldAntiqueBold.ttf" media-type="application/x-font-ttf" />

The font is attached and was downloaded from a free site.
All this has no effect. Can someone point out mt errors?

Hi Charlie-

Couple of suggestions:
Replace this:
@font-face {
font-family: "Garfeld";
font-style: normal;
font-weight: bold;
src:url(../Fonts/"GarfeldAntique Bold.ttf");
With
@font-face {
font-family: "GarfeldAntique";
font-style: normal;
font-weight: bold;
src:url(../Fonts/GarfeldAntique Bold.ttf);

Replace this line:
font-family:Garfeld,"Times New Roman",
With
font-family:"GarfeldAntique";

I think this may work. Let me know so we can both learn.

Regards - John

P.S. The @font-face statement is not required to be at the top of the style sheet as far as I can tell.

[crutledge]

Tried what you said, but something is still wrong!!!

See attached ePub I've been experimenting with. Perhaps someone can make it work and send it to me.

I'd surely like to see a pony. Maybe an ebook that works. I'm probably making it haeder than it truly is.

[Jabby]

Originally Posted by crutledge

Tried what you said, but something is still wrong!!!

See attached ePub I've been experimenting with. Perhaps someone can make it work and send it to me.

I'd surely like to see a pony. Maybe an ebook that works. I'm probably making it haeder than it truly is.

Hi again Charlie-
I think that your font file may be faulty, so.....

I'm not sure just what you are trying to do. If you are wanting a different font for the text, here are a couple of examples. I selected a serif and a sans serif font. Remember - epubs look different depending on the reader.

I have added font files, @font face statements and altered your "h1...h6" and the "p" definitions.

I think the best way to control fonts is to add the entire font group (regular, bold italic and bolditalic). This way gives you more options in the books appearance.

Regards - John

[JSWolf]

Originally Posted by crutledge

Tried what you said, but something is still wrong!!!

See attached ePub I've been experimenting with. Perhaps someone can make it work and send it to me.

I'd surely like to see a pony. Maybe an ebook that works. I'm probably making it haeder than it truly is.

Whatever it is you did, the base font is microscopic and unable to be sized so it can be read.

[Jabby]

Originally Posted by JSWolf

Whatever it is you did, the base font is microscopic and unable to be sized so it can be read.

I just downloaded both of them and played them on ADE viewer, Sony viewer, Firefox Plug-in and Calibre viewer. They looked OK here. But who knows. This stuff is mostly black magic anyway.

What reader were you using?

Anybody else having this problem?

Regards - John

[Sunlite]

@crutledge: I looked at your file in the Desktop ADE and I see the microscopic font size, too.

I took also a closer look at your CSS file and there are two things that ADE does not like.

1)

a: {
	color: black;
}

should be

a {
	color: black;
}

2)

p, div {
	margin-top: 0;
	margin-bottom: .5em;
	margin-right: 0;
	margin-left: 0;
	text-indent: 1.5em;
	font-size: 2 em;
	font-family:GarfeldAntique,"Times New Roman", Times, serif;
}

ADE doesn't like the space between '2' and 'em' in the font-size statement.

After correcting these, your font does display in ADE.


By the way, why do you want the font size of the text to be bigger than the font size of the title? (text: 200% = 2em; h3.chapter: 150% = 1.5em)