Comments on: ePub and CSS: a reading system perspective

By: Keith Fahlgren

Keith Fahlgren — Fri, 09 Apr 2010 17:09:32 +0000

@Christoph: You raise an interesting use-case I hadn’t considered. I’ve emailed you privately to help understand the content in more detail.

By: Christoph Steinhof

Christoph Steinhof — Fri, 09 Apr 2010 13:41:28 +0000

I sometimes depend on manipulate margins, if I need to create something like (automatic) paragraph or line counters. Therefore the “page” needs a lager left margin so that the numbers fit nicely besides the block of the paragraph.
p {margin-left 2em; counter-increment: paragraph;} p:before {content: counter(paragraph); display: block; float: left; width: 2em; margin-left: -2em}

The code above works great on the web version of Ibis Reader but not on the mobile one.

By: TRS

TRS — Sun, 04 Apr 2010 18:56:32 +0000

I would love to read more about width/margin chicken/egg. This is especially difficult in my books with code, tables, and nested content.

By: Acronyms From XHTMLHELL | Ditchwalk

Acronyms From XHTMLHELL | Ditchwalk — Wed, 31 Mar 2010 23:52:49 +0000

[...] Keith Fahlgren has a post about ePub and CSS that’s worth reading, if only to give you an idea of what’s coming in terms of [...]

By: Liz Castro

Liz Castro — Tue, 30 Mar 2010 16:04:26 +0000

I’m pretty concerned that there will be a slew of different eReaders each with its own way of interpreting ePub styling. It’s browser wars all over again.

It would be nice if there were the option of using the eBook designer’s styles as is. Is that a possibility you’ve considered?

thanks,
Liz

By: bowerbird

bowerbird — Wed, 24 Mar 2010 20:22:46 +0000

um, surely you let the end-user have the final say, not?

so what does it matter what happens before that point?

-bowerbird

By: Adam Witwer

Adam Witwer — Tue, 23 Mar 2010 16:33:21 +0000

Glad to see this discussion happening.

After a lot of testing with width, margins, percentages, etc., across several devices and reading systems, we finally settled on this CSS, which is used in most of the O’Reilly EPUBs:

@page {
margin-left: 8px;
margin-right: 8px;
}

And then we zero out the margin and padding at the body level.

I had a really hard time with percentages in some readers (particularly Stanza, which seemed to overcompensate) and so moved away from using them. And having no left margin at all makes the text smack up right up against window in ADE and other systems. In my testing anyway, 8 px seemed to be be the sweet spot, but that could change as the readers mature.

By: iPad Links: Monday, March 22, 2010 « Mike Cane's iPad Test

iPad Links: Monday, March 22, 2010 « Mike Cane's iPad Test — Mon, 22 Mar 2010 23:14:55 +0000

[...] Gordon … Ken Scott Makes Records for Beatles, Bowie, Beck – And That’s Just the ‘Bs ePub and CSS: a reading system perspective Reading for a living [...]

By: Keith Fahlgren

Keith Fahlgren — Mon, 22 Mar 2010 16:02:51 +0000

Does Ibis Reader offer a different experience for all (of those) eReaders? And you didn’t mention iPad… what happens there?

Ibis Reader tries to look very consistent across all of the devices that can use the HTML5 mode, although there are some minor differences in how the individual browsers show the pages. We're waiting till we have an iPad in our hands before we make specific design choices for that device, but I suspect it'll get special treatment, as we don't need to be quite so agressive in conserving screen real estate on that big of a device.

What do you mean by chapter level? As opposed to individual pages?

I'm just struggling for vocab here. I'm talking about CSS targeted at high-level selectors like body and @page to establish margins at the "page" level rather than something much more specific that is focused on the display of a single element.

My personal opinion is that we need to all get to the same page really quickly…

That's our hope as well, and why we're trying to be open and public about our choices. Some of them certainly will turn out to be wrong, so we'd like to encourage dialog and discover them early rather than playing things too close to the vest.

By: Liz Castro

Liz Castro — Mon, 22 Mar 2010 14:50:53 +0000

P.S. Yes, a history of how you got to “Basic, top-level margins should be established by every reading system based on the device being used and designers should include margins in their CSS only when they are focused on a specific type of content like a blockquote or poem.” would be much appreciated.