Skipping pages in kindle causes formatting problem?

[Mike56]

Hi everyone, I'm new to the forum, and I have a problem I hope you can help me with.

There's a problem with some kindle ebooks (mine included) that happens in Kindle for Iphone/Ipod (and I'm guessing in other places too). I don't know if the mobi file is to blame or the Kindle for Ipod software. My guess is the mobi file since other ebooks are fine.

Here's the thing; if I skip many pages/locations and the first paragraph is "cut", Kindle doesn't load the tag's formatting. The formatting for that paragraph will only be loaded if I go back until finding the first line.

I'll show an example. Let's say I have this class

.myclass { text-align: left; }

and there's this paragraph in the ebook

<p class="myclass">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum
<p>

I decide to skip many locations ahead, to a location that starts with the second line of the paragraph "tempor incididunt ut labore ...". This paragraph will look justified instead of left aligned. I go back one location, where the first line of the paragraph is; since it's the start of the element, it reads the tag formatting, in this case, the .myclass text-align style.
I advance one location, right where I was before; now that the tag formatting has been read, the paragraph is left aligned.

How can I prevent this from happening? Everytime I skip locations many paragraphs have the default formatting (justified text, different margins), causing a terrible visual impact (this is left aligned, that is justified, this paragraph has a different margin than that other one...).

Thanks in advance!

Mike.

[susan_cassidy]

I've seen this happen, but only very rarely, and never consistently. Have you tried a reset of the Kindle.

[Mike56]

I don't have a Kindle device, I use the kindle software for Ipod/Iphone.
I've tried my ebook on Kindle for PC and works perfect. The problem happens with Kindle for Ipod (and if it happens with Ipod, I bet it happens with other devices/software).

[William Ockham]

Originally Posted by Mike56

I don't have a Kindle device, I use the kindle software for Ipod/Iphone.
I've tried my ebook on Kindle for PC and works perfect. The problem happens with Kindle for Ipod (and if it happens with Ipod, I bet it happens with other devices/software).

That would be a very poor bet, unless you limit your bet to other IOS devices. The Kindle iOS app is not like any other Kindle device or app. It has a distinct set of ever-changing issues. At the moment (since a week or so ago), you will see completely different behavior for the same ebook depending on whether you downloaded from Amazon or sideloaded.

If this is a book you bought from Amazon and you downloaded it more than a couple of weeks ago, remove it from your device and re-download it. That may (or may not) resolve your issue.

If this is a book you created and sideloaded, you need to tell us more about how you created the book.

[Mike56]

I created my book using the epub editor Sigil. Then I convert the file to mobi using KindleGen.
The Kindle Previewer has the same issue when I select "Kindle for Ipad" or "Kindle for Iphone". iOS has this problem when skipping pages, and the Kindle Previewer just imitates it.

[Mike56]

Nobody has any idea of how to fix this?

[William Ockham]

To help you understand why answering your question is difficult, I need to give a little background. I apologize if you know this already, but others reading this may not. To the best of my knowledge, what I am about to tell is correct as of today (17-Aug-2013), but could change at any time. The situation was somewhat different a month ago.

When you run an epub file through Kindlegen it creates a file that contains your book in both the old mobi format and the new KF8 format. What you see in the Previewer and on your device for sideloaded files is the old mobi format. However, sometime in the last couple of weeks, Amazon has started sending the KF8 format for books that are downloaded directly from Amazon's site. If you are producing a book to be sold on Amazon, what you see (in the Previewer) is NOT what you get (when you download from Amazon).

Kindlegen produces the old mobi format by converting the xhtml + css2 from the epub into the rough equivalent of html 3.2 (more or less). It is really important to remember that there is nothing close to a one-to-one mapping for everything in css2 to equivalent formatting in html 3.2. Kindlegen is giving its best effort to translate your intent.

The resulting html will then be displayed by some bastardized version of webkit (which is the display engine for most mobile browsers). The Previewer also uses webkit as its display engine.

The problem you are running into could be coming from a number of different places and I don't think you have given us enough information to diagnose the problem. That's not your fault. This stuff is just really more complicated than it should be and changing all the time.

Something about your css formatting could be confusing Kindlegen. Kindlegen might just have a bug in it that no one else has noticed (that happens more often than you think). There could be a bug in webkit in rendering the html that Kindlegen is producing. It could be some combination of all of those things or something else entirely.

Skipping around to random locations in the middle of paragraphs is not a very common use case, except for certain types of books (the most common examples are probably religious texts). How important is this to you? It could take a lot of time to figure out exactly what the problem is, there's no guarantee that you can do anything about it except reformat your book, and the problem might go away entirely if you wait long enough.

If you really want to fix it, I can give you some generic debugging advice. Start by redoing your css file to simplify it enough to make the problem go away. That is, leave all your classes in, but swap the statements to make them all the same (and the same as the default). That should be fairly straightforward in Sigil.

Then, progressively add in the formatting to one class at a time. The idea is to figure which part of this complex system is failing. You also might want to investigate Kindlestrip so that you can see what the mobi formatted html looks like. If installing seems a bit much, you could always post your book here and ask for someone to run it for you (but only after you tried figure out the problem yourself).

Hope that helps.

[Mike56]

Thank you for taking your time to answer. Yes, my file contains both the new and old format, but I don't think it's my file's fault. I've downloaded many epubs from popular authors and converted them to .mobi using Kindlegen; the result was always the same, they all had the problem I've described before.
I guess I shouldn't pay any attention to it as it's probably the webkit or Kindlegen's fault. Like you said William, people are not going to be skipping around randomly, so I guess I shouldn't worry much. It's just that I want every single detail to be perfect, and I hate it when I don't have control over something. I'll just have to let it go.

Thanks again!

[Hitch]

Originally Posted by Mike56

Thank you for taking your time to answer. Yes, my file contains both the new and old format, but I don't think it's my file's fault. I've downloaded many epubs from popular authors and converted them to .mobi using Kindlegen; the result was always the same, they all had the problem I've described before.
I guess I shouldn't pay any attention to it as it's probably the webkit or Kindlegen's fault. Like you said William, people are not going to be skipping around randomly, so I guess I shouldn't worry much. It's just that I want every single detail to be perfect, and I hate it when I don't have control over something. I'll just have to let it go.

Thanks again!

Well, not to mention:

Generally speaking, it's extremely unlikely that every single paragraph in a book is different than every other paragraph. Or, rather, that of 3, 4 or 5 paragraphs in a row, they are each differently formatted. If the base paragraph formatting is the usual (first-line indent, whatever spacing, yadda), then all the paragraphs will render that way, even when thumbing backwards.

This happens quite frequently when people erroneously use inline styling, as well; you see it quite a lot with Word file uploads, or "HTML" that is the result of "save as, HTML, filtered" ebooks, rather than HTML that's been cleaned up, recoded, and the like. The styling or class information is contained in the opening paragraph tag, rather than a stylesheet that the device can use, so the paragraph doesn't get rendered as it should.

The same thing happens when people put the header info outside of the anchor tag for a chapter head, from the TOC...they "jump" to the header, and instead of looking like a nice, centered chapter head, it looks like a left-aligned paragraph, because the header tag isn't rendered. If they put the anchor tag outside of the header tag, they get what they expect (or on the previous line, as an alternative). {shrug}. Generally speaking, it's just not that big of a deal, but with some care, and working in the code, a lot of it can be eliminated. Not all, mind you--but a lot.

ETA: And, the K4iPad app is flaky. Sometimes, you'll get K8 styling. Sometimes, you'll get K7 styling; and sometimes--when life is really, really special--you get BOTH.

Hitch

[Mike56]

The book works perfect with Kindle Previewer (using any device except iPad and iPhone) and Kindle for PC. It's the iOS app the one giving trouble. I mean, how hard can it be? An app that reads html code doesn't sound that complicated...

[Hitch]

Originally Posted by Mike56

The book works perfect with Kindle Previewer (using any device except iPad and iPhone) and Kindle for PC. It's the iOS app the one giving trouble. I mean, how hard can it be? An app that reads html code doesn't sound that complicated...

It's an App by one giant company running on a device created by another giant company, and those giant companies have a pissing contest over who gets paid when a reader buys a book from Amazon, via the App. Such a huge pissing contest that Amazon deliberately disabled the ability of readers in the K4iPad app to "go to" Amazon to buy books; for that to work, they have to be in Cloud Reader.

And don't trust Previewer. Don't trust it as far as you can physically pick it up and throw it.

The real issue is that K4iPad has been using BOTH K7 and K8 styling, ignoring media queries. It's hard to know who's to blame for that. That's why you'll see oddball things like indented paragraphs plus a blank line between them, or the like.

I don't think that Amazon sees K4iPad as a big priority. And as other posters told you, this "lack of rendering" issue has happened in the past with other devices as well. I take it this is clearly not an inline styling issue? All your paragraphs are styled with an external stylesheet?

Hitch

[Mike56]

All of the styling is on a stylesheet. I followed some tutorials, and this is what I did:

I have a main.css file with all the classes, for example

.indent
{
text-align: left;
indent: 1em;
...
...
}

Then I have .xhtml files (where the book is written) with this code

<link href="../Styles/main.css" rel="stylesheet" type="text/css" />

and all the paragraphs that I want indented are

<p class="indent">TEXT</p>

I've avoided any inline styling, it's all defined in the external sheet, so I'm going to blame the big companies for these weird results. It wouldn't be the first time an apple product (or any other big company product) has given me trouble.

[Hitch]

Originally Posted by Mike56

All of the styling is on a stylesheet. I followed some tutorials, and this is what I did:

I have a main.css file with all the classes, for example

.indent
{
text-align: left;
indent: 1em;
...
...
}

Then I have .xhtml files (where the book is written) with this code

<link href="../Styles/main.css" rel="stylesheet" type="text/css" />

and all the paragraphs that I want indented are

<p class="indent">TEXT</p>

I've avoided any inline styling, it's all defined in the external sheet, so I'm going to blame the big companies for these weird results. It wouldn't be the first time an apple product (or any other big company product) has given me trouble.

Mike:

Make sure you remove the text-align:left. That will come back to you and Amazon will make you redo the book to remove any "forced" alignment in large blocks of text. If you only used it in a few places--say, a chapter head--fine. But if you have large swaths of body text set that way, you'll get dinged. I would have mentioned this earlier, but I didn't understand that you were using it a lot. If you are...don't.

With regard to the other issue, it's simply that browsers and ebook-readers work from front to back. AND, Apple and Amazon don't play well together. If you think this is bad, try making books for the iBooks app. That will make your eyes bleed.

Hitch

[Mike56]

I read about not forcing the text alignment, I had removed the text-align:left time ago, but thanks for telling anyway, I wasn't sure if I had to remove the code. Many ebooks I've seen have hard-coded text-align (and I'm talking about new books). I've only used it to center chapter titles and the like.
It's harder making iBooks? Phew, I guess I made the right choice choosing amazon!