Drop cap bug on Paperwhite

[dgatwood]

For some unknown reason, my drop caps are rendered completely wrong on exactly one device: Kindle Paperwhite. Or at least they're wrong in the previewer. It would be great if someone who owns an actual Paperwhite could download the test sample linked at the bottom of this post and confirm whether this problem occurs on the actual device.

My drop caps work fine in other readers (Nook and multiple other ADE-based readers, iBooks, Kindle Fire, Kindle Fire HD, etc.), but Paperwhite reliably renders them way too low and renders the box too tall (so that too many lines are indented).


They should look look like this:




But on Paperwhite, even with Publisher Font enabled, they look like this:




I have drop caps defined like this:

.dropcap
{ 
        letter-spacing:0;
        text-transform:uppercase;
        font-family: "Telegraph Hill", Didot, "GFS Didot",
                "New Century Schoolbook", "Century Schoolbook",
                "Bookman Old Style", Bookman, serif;

        font-size:4.8em;
        display: inline-block;
        position: static;
        float:left;
        border: 0;
        /* Margins are set on a per-character basis. */
        /* margin: 0; */
        padding: 0;
        line-height: 1.2;
        height: .75em;
}

Or, alternatively, like this:

    .chapterdropcap
    {
        letter-spacing:0;
        text-transform:uppercase;
            font-family: "Telegraph Hill", Didot, "GFS Didot",
                    "New Century Schoolbook", "Century Schoolbook",
                    "Bookman Old Style", Bookman, Serif;
        font-size:4.8em;
        display: block;
        float: left;
        line-height: 120%;
        height: 0.75em;
    }

With HTML that looks like this:

<p class="kindlefirst"><span class="dropcap chapterdropcap" style="margin: -0.235714285714286em 0em 0 -0.00428571428571429em;">T</span><!--font size="2"--><span class="smallcap">he</span>*musty air stung their noses as they walked through the abandoned ship, its uninviting halls dark and cold, but there was air.  There was definitely air, and that alone was an improvement.<!--/font--></p>

Does anybody see anything obviously wrong here, or is Paperwhite just massively broken?

You can download a test sample here: kindle_dropcap_sample.mobi

[Jellby]

"text-transform" and "display: inline-block" are not supported by the ePub spec, but maybe they are by the Kindle, and they probably are unrelated to your problem ("position" is also not in the list of supported CSS properties, but it's mentioned in several places in the spec).

[Doitsu]

Unfortunately, I cannot help you with your problem, but I wanted to let you know that your .mobi file looked different on my old K3 with KF8 support.
Whatever solution you come up with, you may want to also test it with other eInk Kindles, because it seems that the PW has a different rendering engine.

[dgatwood]

Originally Posted by Jellby

"text-transform" and "display: inline-block" are not supported by the ePub spec, but maybe they are by the Kindle, and they probably are unrelated to your problem ("position" is also not in the list of supported CSS properties, but it's mentioned in several places in the spec).

Since it's all uppercase, text-transform is a no-op anyway.

One of the two drop cap styles uses block and the other uses inline-block, so that's also a non-issue.

The position property most certainly is in the EPUB spec. It says "Use of the CSS position property values to achieve absolute positioning (i.e. absolute and fixed) is strongly discouraged."

Note that position: static is the default, so this should always be a no-op. I inserted it just in case there was something screwy going on.

[dgatwood]

Originally Posted by Doitsu

Unfortunately, I cannot help you with your problem, but I wanted to let you know that your .mobi file looked different on my old K3 with KF8 support.
Whatever solution you come up with, you may want to also test it with other eInk Kindles, because it seems that the PW has a different rendering engine.

AFAIK, everyone's drop caps are known to be broken on K3, so my inclination is to pretend K3 doesn't exist until Amazon fixes it.

That said, I would be curious how it looks with Publisher Fonts enabled.

[DiapDealer]

Like chasin' your own tail, man. Get it in the ball-park, then shake it off and move on. Too many devices with too many different renderers to make 'em all sing the same song on key at the same time.

Why do you have so many fallback fonts in your font-family declarations if you're embedding all the fonts anyway?

Your sample mobi looks the same on the Kindle Fire as your screen-shot from the Paperwhite, BTW.

[Jellby]

Originally Posted by dgatwood

The position property most certainly is in the EPUB spec. It says "Use of the CSS position property values to achieve absolute positioning (i.e. absolute and fixed) is strongly discouraged."

Yes, but it's not in The List. That's what I meant, there are references to it, but it doesn't appear in the list of supported properties, which is probably a bug.