2 Replies Latest reply: Oct 20, 2012 12:52 PM by Jimbo53
schlutek Level 1 Level 1 (0 points)

My epub file contains an error I'm unsure how to fix. When looking at the file in iBooks horizontally, some images split between two pages (ie the top of an image appears at the bottom of the page and the remaining image appears at the top of the next page). iBookstore's support suggested making sure each image is within its own <div> tag.

 

However, the images splitting are within their own <div> tags.

 

But does it matter that the <div class="keep"> is {display: inline-block;}? Could this be the concern?

 

Is there another solution to prevent images splitting? As i mentioned, this only happens for some (and not all) images in the horizontal viewing. I'm also confused as i have images that are not contained in their own <div> and those images are not breaking.

 

So, what causes the images in ibooks to split between pages? Any thoughts or advice?

  • 1. Re: Image split error in iBooks
    mzmm Level 1 Level 1 (5 points)

    you should be able to prevent images from splitting between pages by wrapping them in a div with the 'page-break' property set to 'avoid'.  ie:

     

    .nobreak {

         page-break-inside: avoid;

    }

     

    <div class="nobreak"><img/></div>

     

    i've used the inline-block method you've described to keep images from splitting apart from their captions across pages, although the page-break method will work for that as well.

  • 2. Re: Image split error in iBooks
    Jimbo53 Level 1 Level 1 (0 points)

    I tried "page-break-inside: avoid" and it was successful.