View Single Post
Old 05-23-2024, 04:41 PM   #4
JSWolf
Resident Curmudgeon
JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.JSWolf ought to be getting tired of karma fortunes by now.
 
JSWolf's Avatar
 
Posts: 80,034
Karma: 147977995
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
Quote:
Originally Posted by radius View Post
Hi,

I was wondering if anyone knew what fonts a Kobo (Aura One specifically) chooses for its fallback fonts? The reason I ask is I'm assembling some books for my kid and I find that using bare "monospace" as a font-family doesn't seem to work for me.

In the sample code below, I see the first paragraph in a serif font, the second in a sans font, and the third paragraph looks like the first one.

Code:
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
  "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title></title>
</head>

<body>
  <p style="font-family: serif">This paragraph is in serif font.</p>

  <p style="font-family: sans-serif">This paragraph is in sans-serif font.</p>

  <p style="font-family: monospace">This paragraph is in monospace font.</p>
</body>
</html>
Monospace does not work out of the box. You can get monospace to work with KePub by embedding a monospace font. But you can do it even easier if you use ePub.

The first thing to do it find a Courier font. name the font files...
Courier-Regular.ttf
Courier-Bold.ttf
Courier-Italic.ttf
Courier-BoldItalic.ttf

Put them in the fonts directory. Then in the CSS, use the following code.

Code:
@font-face {
font-family:monospace;
font-weight: normal;
font-style: normal;
src: url(res:///Data/fonts/Courier-Regular.ttf);
}
@font-face {
font-family:monospace;
font-weight: bold;
font-style: normal;
src: url(res:///Data/fonts/Courier-Bold.ttf);
}
@font-face {
font-family:monospace;
font-weight: normal;
font-style: italic;
src: url(res:///Data/fonts/Courier-Italic.ttf);
}
@font-face {
font-family:monospace;
font-weight: bold;
font-style: italic;
src: url(res:///Data/fonts/Courier-BoldItalic.ttf);
}
Now when you have font-family: monospace; you will have a monospace font displayed.
JSWolf is offline   Reply With Quote