Palatino bug in iBooks on iPad

[Update: With iBooks 1.1, Apple has changed much of the system for applying fonts. Please read Apple damaging ePub standards with pseudo-support and Apple kills fonts in iBooks, strikes blow to standards.]

I discovered a big and important bug in iBooks on the iPad: if you don't have some text specified as Palatino (in some form or other), no other fonts will be displayed and everything will display in Palatino.

So, imagine you have this for your CSS:

p.palatino {font-family:"Palatino";}
p.other {font-family:"Optima";}

In the XHTML, the first paragraph is styled with the palatino class, and the rest is other.

Since Palatino is explicitly called, everything is displayed correctly:

Now, you decide you don't really want Palatino, but would prefer Zapfino. Your CSS now looks like this:

p.palatino {font-family:"Zapfino";}
p.other {font-family:"Optima";}

Here's where the bug kicks in. Since there is no paragraph explicitly or implicitly styled with Palatino, iBooks freaks out and makes everything Palatino:

There are various solutions. As you can see with the first example, if Palatino is called for and used explicitly, everything is fine.

But you don't actually have to call the font explicitly, you can just call no font (which in effect also means Palatino, since that's the default font in iBooks). I've tried this with explicitly font-related styles, like font-size, and with less font-related properties like text-align. As long as there's some selector with at least one rule, and that doesn't specify a font, you're good:

p {text-align:left;}
p.other {font-family:"Optima";}

And again, it works fine:


Ah, but what if you don't want Palatino in your ebook at all? If you remove it from the XHTML, even if you leave it in the CSS, iBooks goes nutso again:

The solution is to leave a Palatino style in your CSS, with display:none if you like and call that style at least once in your XHTML.

CSS:
p.palatino {font-family:"Palatino";display:none;}
p.other {font-family:"Optima";}

XHTML:

<p class="palatino"> </p>

And voilà: no Palatino, and the Optima (or whatever other font you want), displays perfectly well!