01-23-2013, 07:05 AM | #1 |
Connoisseur
Posts: 53
Karma: 10
Join Date: Jul 2012
Location: Seattle, USA
Device: Nook
|
EPUB validates, and breaks in iBooks
Hello,
(Duplicate of this post, because I wasn't sure which forum would be more appropriate.) I am a bit baffled. Been building EPUB books that validate without errors/warnings in "epubcheck", which work just fine on my Nook, various applications including ADE, convert to .mobi using Kindlegen... No problems at all. Then today I tried them on an iPad and everything looks just very broken - In portrait mode, the text on a page is cut off on the right side and it seems they indent too much on the left side of the page. Some work in double-page landscape, but some also cut of in landscape mode. - They seem to have empty pages inserted after each short page-chapter. I use chapters to enforce a page break, and so (in the beginning of the book) there are short one-page chapters with a dedication and such. Each of those is followed by an empty page. - Looks like the cover image is a page of its own, but not on the actual front cover of the book. I mean that the book (in iBooks) doesn't open visually, it is already open with a cover image rendered onto the first page, and I just turn the page like any other page. - The weirdest thing though is that none of the chapters render for more than two pages. The chapters of the book should be many pages long, but only the first two are rendered, followed by the next chapter!? I am lost here, to be honest. I didn't use any iBook specific tags/tricks, and I (wrongly, so it seems) assumed that a validated EPUB is a "safe enough" implementation. Wrong, huh? Has anybody seen the same issues, similar issues, and can offer tips and experience regarding their solution? Any help and insight is appreciated :-) Thanks! |
01-23-2013, 07:48 AM | #2 |
Wizard
Posts: 4,520
Karma: 121692313
Join Date: Oct 2009
Location: Heemskerk, NL
Device: PRS-T1, Kobo Touch, Kobo Aura
|
I wrote something about that quite some time ago. There is something in your stylesheet causing this. Can you post your stylesheet, especially the html, body and @page if it is there.
|
01-23-2013, 08:36 AM | #3 |
Wizard
Posts: 4,520
Karma: 121692313
Join Date: Oct 2009
Location: Heemskerk, NL
Device: PRS-T1, Kobo Touch, Kobo Aura
|
I did a quick check in my notes and it appears that there were two culprits here. It might be that one is solved though.
If you have height:100% in your body and/or html classifiers in the stylesheet, this might occur. I also found this behavior when the @page is in the stylesheet, this was not really supported in iBooks. That might have been changed though. |
01-23-2013, 02:53 PM | #4 |
Connoisseur
Posts: 53
Karma: 10
Join Date: Jul 2012
Location: Seattle, USA
Device: Nook
|
Thanks for the response. The stylesheets vary across the books. The one that gets cut off but doesn't have its chapters truncated
Code:
html { width: 100%; height: 100%; } Code:
html, body, table { width: 100%; height: 100%; margin: 0; padding: 0; border-width: 0; } |
01-23-2013, 03:07 PM | #5 |
Resident Curmudgeon
Posts: 76,310
Karma: 136006010
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
Why do you have width and height in html and body? You don't need them there.
Code:
body { widows: 0; orphans: 0; margin-top: 0; margin-bottom: 0; margin-left: 0; margin-right: 0; text-align: justify } |
01-24-2013, 06:59 AM | #6 |
Connoisseur
Posts: 53
Karma: 10
Join Date: Jul 2012
Location: Seattle, USA
Device: Nook
|
Toxaris, JSWolf: Nice, that seems to have taken care of almost all the issues :-)
What about the cover image though? Is that normal that it renders on the first page, instead of looking like an actual book cover one opens? |
01-24-2013, 09:48 AM | #7 |
Resident Curmudgeon
Posts: 76,310
Karma: 136006010
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
Yes, it is correct for the cover image to be the first page.
|
01-24-2013, 03:02 PM | #8 |
Connoisseur
Posts: 53
Karma: 10
Join Date: Jul 2012
Location: Seattle, USA
Device: Nook
|
|
01-24-2013, 11:22 PM | #9 |
Curmudgeon
Posts: 629
Karma: 1623086
Join Date: Jan 2012
Device: iPad, iPhone, Nook Simple Touch
|
The only time it might be useful to have height on the html and body tag is if you're doing a single-page fixed-layout spread, such as a dedication page with a single line centered vertically. In paged media, a height of 100% means one page height (or at least it is supposed to—not all renderers seem to get this right).
|
01-24-2013, 11:26 PM | #10 | |
Resident Curmudgeon
Posts: 76,310
Karma: 136006010
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
Quote:
|
|
01-25-2013, 02:49 AM | #11 | |
Connoisseur
Posts: 53
Karma: 10
Join Date: Jul 2012
Location: Seattle, USA
Device: Nook
|
Quote:
However, on the iPad this single page caused an empty page to follow, but I _suspect_ that's because of the "width:100%". (I noticed that the width seemed to refer to landscape/double-page rendered width!) |
|
01-25-2013, 05:53 PM | #12 |
Connoisseur
Posts: 53
Karma: 10
Join Date: Jul 2012
Location: Seattle, USA
Device: Nook
|
I noticed the "widows" and "orphans" here, and added them to my styling. I assume it's these two that affect the spacing/stretching between paragraphs to fill a page, and to avoid paragraph breaks that would create widows and orphans.
Frankly, I am torn about this. Do I mind looking at widows/orphans if it gets me consistent spacing? Or do I accept large(er) gaps between paragraphs to avoid them? Hmmm... |
01-25-2013, 06:19 PM | #13 |
Grand Sorcerer
Posts: 28,033
Karma: 199464182
Join Date: Jan 2010
Device: Nexus 7, Kindle Fire HD
|
The widows and orphans bit is just Jon pushing his own agenda. Don't use them if you don't want to.
|
01-25-2013, 10:04 PM | #14 |
Curmudgeon
Posts: 629
Karma: 1623086
Join Date: Jan 2012
Device: iPad, iPhone, Nook Simple Touch
|
I'm not talking about fixed-layout EPUB. I'm talking about doing a single pseudo-fixed-layout page in a flowing book using either an image or SVG (which I suppose is technically an image, sort of, but...).
Last edited by dgatwood; 01-25-2013 at 10:06 PM. |
01-25-2013, 10:06 PM | #15 | |
Curmudgeon
Posts: 629
Karma: 1623086
Join Date: Jan 2012
Device: iPad, iPhone, Nook Simple Touch
|
Quote:
And be sure to not include any such hacks in actual flowing content. Last edited by dgatwood; 01-25-2013 at 10:09 PM. |
|
|
Similar Threads | ||||
Thread | Thread Starter | Forum | Replies | Last Post |
EPub validates in Sigil but not in Apple Store & B&N | ralphiedee | Sigil | 8 | 08-08-2012 05:06 PM |
iBooks: Avoid page breaks within table rows/cells | ckirchho | ePub | 7 | 06-12-2012 03:11 PM |
ePUB validates ok but still warns error!!!??? | panda6855 | ePub | 5 | 01-12-2011 06:14 PM |
iPhone iBooks page breaks not working | BartCubbins | Apple Devices | 2 | 09-08-2010 10:25 PM |