05-25-2011, 03:09 PM | #1 | |
Addict
Posts: 296
Karma: 955301
Join Date: Oct 2008
Device: Sony PRS-300, Sony PRS-T2, Kindle (7th Gen)
|
Strange iBooks problem: only
I helped an author put together a free promotional ebook of some of his short stories. A reader has just gotten back to me with a weird problem in how the EPUB (attached) is displaying in iBooks:
Quote:
I hand-coded everything so the css is pretty clean. I of course have each individual story in its own xhtml file... I'm stumped. *headdesk* I thought I could never hate anything more than kindlegen. It seems iBooks has managed it. |
|
05-25-2011, 03:12 PM | #2 |
Addict
Posts: 296
Karma: 955301
Join Date: Oct 2008
Device: Sony PRS-300, Sony PRS-T2, Kindle (7th Gen)
|
... and I've managed to mess up the thread title *headdesk*
Could some friendly mod change that from "Strange iBooks problem: only" to "Strange iBooks problem: only some text displaying" |
Advert | |
|
05-25-2011, 04:09 PM | #3 |
Wizard
Posts: 4,520
Karma: 121692313
Join Date: Oct 2009
Location: Heemskerk, NL
Device: PRS-T1, Kobo Touch, Kobo Aura
|
This has been reported before as an iBooks issue. I haven't seen a good cause or solution.
|
05-25-2011, 05:02 PM | #4 | |
Addict
Posts: 296
Karma: 955301
Join Date: Oct 2008
Device: Sony PRS-300, Sony PRS-T2, Kindle (7th Gen)
|
Quote:
Can you point me in the direction of one these reports you mention? I haven't been able to find any other accounts of this problem. Maybe I'm using the wrong keywords... |
|
05-26-2011, 05:29 AM | #5 |
Wizard
Posts: 4,520
Karma: 121692313
Join Date: Oct 2009
Location: Heemskerk, NL
Device: PRS-T1, Kobo Touch, Kobo Aura
|
I got a report from an user and I know my CSS is correct. The other report I remember is from last week. There there were some issues with margins I believe but that was not the cause. It could be in the Sigil subforum.
|
Advert | |
|
06-10-2011, 02:28 PM | #6 |
Wizard
Posts: 4,520
Karma: 121692313
Join Date: Oct 2009
Location: Heemskerk, NL
Device: PRS-T1, Kobo Touch, Kobo Aura
|
Just a thought, could it be that iBooks does not support @page?
|
06-10-2011, 07:23 PM | #7 |
Resident Curmudgeon
Posts: 73,514
Karma: 126422064
Join Date: Nov 2006
Location: Roslindale, Massachusetts
Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3
|
|
06-11-2011, 03:43 AM | #8 |
Wizard
Posts: 4,520
Karma: 121692313
Join Date: Oct 2009
Location: Heemskerk, NL
Device: PRS-T1, Kobo Touch, Kobo Aura
|
Since I don't own a device which supports iBooks, I cannot check. I would like to know, not that I will stop using it though...
|
06-11-2011, 12:20 PM | #9 |
Member
Posts: 16
Karma: 172
Join Date: Oct 2010
Device: prs-650
|
I think I see what may be causing your issue, but it is only speculation as I don't have an iPod/Pad/Phone to test it on. In the style.css, try removing the 'height: 100%;' from the 'html, body' section and see if that remedies your situation. I believe that it is limiting everything wrapped by the html and body tags (each xhtml file) to '100%' of one ePub 'page', although one 'page' usually equals two 'screens' at normal font sizes (which is what you're getting).
Code:
html, body {
height: 100%;
margin: 0;
padding:0;
border-width:0;
}
Another couple things I see that you might want to do differently in the style.css (coming from my own experience) are: Try to eliminate adding 'margins' to the top of paragraphs, and instead try to only add to the bottom. If you must add to the top, try to use 'padding' instead. For instance, the first time I opened up the epub in ADE, one of the paragraphs with the 'centerplusgap' class only showed half of the line (vertically), as the specified 'margin-top' of 2em pushed the bottom half of the line below the screen. If you had used padding, that line would have been pushed to the next page instead. In addition, since you already specified a margin-top (again, you should use padding instead) and -bottom for 'p', there is no need to do so for every additional p.class, you only need to include whatever you want changed from the initial settings (such as text-indent, as you change it from 2em to 0em, or adding a text-align). Last edited by koadic; 06-11-2011 at 12:32 PM. |
06-11-2011, 04:40 PM | #10 |
Wizard
Posts: 4,520
Karma: 121692313
Join Date: Oct 2009
Location: Heemskerk, NL
Device: PRS-T1, Kobo Touch, Kobo Aura
|
The height:100% should not pose any issues of course. If it is, put it on the silly list of iBooks.
|
06-11-2011, 07:34 PM | #11 | |||
Addict
Posts: 296
Karma: 955301
Join Date: Oct 2008
Device: Sony PRS-300, Sony PRS-T2, Kindle (7th Gen)
|
Quote:
The combination of Code:
html, body { height: 100%; margin: 0; padding:0; border-width: 0; } @page { margin: 5pt; } Quote:
As for margin-top vs margin-bottom - have you ever used FBReader? For some reason it can't view margin-bottom, only margin-top. And a surprising number of cheap ereaders, like my awful Binatone LCD reader, use a version of FBReader (probably because it can run on Linux and is open source). So I tried to cater for that by picking margin-top instead of margin-bottom. Quote:
So, in summary, Apple, Amazon and cheap ereader makers are driving me insane :-D |
|||
06-12-2011, 09:03 AM | #12 |
Wizard
Posts: 4,520
Karma: 121692313
Join Date: Oct 2009
Location: Heemskerk, NL
Device: PRS-T1, Kobo Touch, Kobo Aura
|
Have you tried without the @page?
|
06-13-2011, 10:21 AM | #13 |
Wizard
Posts: 4,520
Karma: 121692313
Join Date: Oct 2009
Location: Heemskerk, NL
Device: PRS-T1, Kobo Touch, Kobo Aura
|
With some help I managed to change one of my epubs in a manner that iBooks sees all pages...
It is actually the combination of @page and height:100% which causes this problem. Can anyone sent Apple the IDPF specifications together with a CSS tutorial? |
06-17-2011, 06:43 PM | #14 | |
Addict
Posts: 296
Karma: 955301
Join Date: Oct 2008
Device: Sony PRS-300, Sony PRS-T2, Kindle (7th Gen)
|
Quote:
I managed to get my hands on an iPad this evening and tried a few css variations. As Toxaris said, removing the following code from my epub allows it to be viewed in iBooks: Code:
html, body { height: 100%; margin: 0; padding:0; border-width:0; } @page {margin: 5pt;} |
|
06-18-2011, 03:16 AM | #15 |
frumious Bandersnatch
Posts: 7,514
Karma: 18512745
Join Date: Jan 2008
Location: Spaniard in Sweden
Device: Cybook Orizon, Kobo Aura
|
Doesn't just this work?:
Code:
@page { margin: 5pt; } html body { margin: 0; padding: 0; } |
Thread Tools | Search this Thread |
|
Similar Threads | ||||
Thread | Thread Starter | Forum | Replies | Last Post |
ibooks margin problem | redryder | Conversion | 2 | 04-16-2011 06:49 AM |
Strange email problem | Giggleton | Calibre | 10 | 03-06-2011 07:10 AM |
Strange iBooks navigation | Dwayne Smith | Apple Devices | 10 | 01-02-2011 05:53 PM |
Just had a strange problem with my 505 | kennyc | Sony Reader | 5 | 10-11-2009 07:14 AM |
Strange problem with formatting | daesdaemar | Workshop | 9 | 01-29-2009 05:11 PM |