Here are some Kindle CSS gotchas I’ve come across recently. I’ll update this post with more such oddities as (or if) I come across them.
text-align:center;fails if designated as
!important, even if the left and right margins are set to zero.
text-indent:0;fails (ignored). It works if you specify the measurement:
These quirks are present in each of the reader programs I tried: Kindle Previewer, Kindle for PC, and Mobipocket Reader. This leads me to suspect that they are bugs in Kindlegen rather than in the Kindle reading software; I don’t know how Kindlegen works but my guess is that it contains a CSS translator that generates inline formatting, leading to possibilities of flawed HTML being generated if the translation code isn’t spot-on. If so, we can hope that these quirks will be fixed in a future Kindlegen release. In the meantime, the potential work-arounds/trade-offs are obvious — but note that Stanza on iPad requires
!important in order to center body text; you might want to force body text centering on Kindle by using
<div style="text-align:center;"><p class="MyCenteredClass">...</p></div> instead, in order to maximise the portability of your ePub.