Creating ebooks for the Apple iPad and Other ereaders: Advanced EPUB Formatting
InDesign, not to mention Word, doesn’t even begin to scratch the surface of the design capabilities available in EPUB. I haven’t found an EPUB editor that does. Regardless of what you start with—InDesign, Word or handcoded XHTML—you can always add additional effects with a text editor in order to take advantage of all that EPUB supports. In this chapter, you’ll learn about:
- Ensuring ereaders use your CSS
- How InDesign writes XHTML and CSS and what to do about it
- How to choose and specify fonts for your ebook
- How to keep elements together, create drop caps and small caps, control spacing and indents, deal with short lines, and insert borders and backgrounds
- What to do about hyphenation
- How to insert images and have text wrap around them
- How to add links, tables, and even video to your ebook
- And how to convert InDesign inheritance into CSS inheritance
All of the techniques in this chapter are based on XHTML and CSS that work in iBooks on the iPad and other ereaders, but that aren’t generated by Word or InDesign. For a more detailed explanation of how to write XHTML, see my bestselling HTML, XHTML, and CSS: Visual QuickStart Guide, 6th Edition, also published by Peachpit Press.
Ensuring ereaders use your CSS
Because older ereaders weren’t as good at supporting CSS, newer ereaders got into the extremely dubious habit of automatically overriding designers’ CSS in order to compensate. In particular, properties like margin, padding, line-height, width, font-size, and font-family are routinely ignored for one’s own good! Gee, thanks! Luckily, some ereaders will listen to you if you override their override by using !important.
- To insist that your CSS rule take precedence, add !important to the end of it (between the property/value pair and the semicolon).
margin: 0 .5em 0 0
!important
;
Because this overuse of !important can cause some rules to override other rules in the same style sheet, it will be wonderful when these ereaders stop requiring its use. In the meantime, be aware that an !important declaration takes precedent over one that is not so important, even among your own rules in your own CSS file.