[dgatwood]

Originally Posted by zonker

I
But in "3.6.10 Image Guideline #10: Displaying Text Correctly within SVG" of "Amazon Kindle Publishing Guidelines" I found that:

I really can't imagine why the Kindle image guidelines recommend that. Yes, font-size is a legal attribute on an SVG text tag, but in practice, the tools I've used to produce SVG output all use CSS attributes on a tspan tag instead. And it works just fine in every version of Kindle's actual reader software that I've tried. (That said, I've never tried their online previewer.)

If any Kindle reader fails to handle something as simple as an inline style on an SVG tag, then it really can't be said to support SVG... or HTML, for that matter. That would be such a laughable omission of such basic HTML functionality that even non-programmers should feel justified at mocking their entire engineering team mercilessly if such a bug went uncorrected.

So I'm pretty sure that these are not the droids you're looking for, and that if their online previewer is butchering the formatting in this way, it is simply doing something very wrong. With that said, it might be worth dropping a note to the KDP people asking for clarification on that. There's certainly no legitimate reason why CSS styles on SVG elements should be ignored, but if there are known bugs somewhere, it would be nice to know it so we can add it to the rather long list of known eBook reader CSS handling bugs that has been steadily growing over on the wiki site.


BTW, with regards to the Kindle DX, the way you solve that is pretty straightforward. First, in your CSS, declare two media rules containing two styles apiece:

@media amzn-mobi {
        .kf8only {
                display: none;
        }
        .mobionly {
                display: inline;
        }
}
@media amzn-kf8 {
        .kf8only {
                display: inline;
        }
        .mobionly {
                display: none;
        }
}

Then wrap the SVG content in <span class="kf8only">...</span> and wrap a basic, HTML-formatted title page in <span class="mobionly">...</span>.

When you view the page on older, pre-KF8 Kindle readers, you'll get the simplified title page, which won't be as neatly formatted, but at least the information will be there. And when you view it on a newer, KF8-compatible reader, you'll get the nice SVG title page.