View Full Version : why does tall image splits into two pages.?!!


ali_86
01-20-2013, 07:49 AM
sometimes when image is taller than the preview area of the epub page , the image splits into tow parts , a piece of image appear in the next page !!

so what is the best way to show image without split ?!

thanks.

Toxaris
01-20-2013, 08:39 AM
resize the image? Make it smaller.

ali_86
01-20-2013, 08:53 AM
even if the image is small .. if the imag came at the end of a page and there is no enough space to view the whole image. image splits into tow parts .. every part appear in different page!!!

dgatwood
01-20-2013, 03:19 PM
sometimes when image is taller than the preview area of the epub page , the image splits into tow parts , a piece of image appear in the next page !!

so what is the best way to show image without split ?!

thanks.

On what reader?

JSWolf
01-20-2013, 03:33 PM
sometimes when image is taller than the preview area of the epub page , the image splits into tow parts , a piece of image appear in the next page !!

so what is the best way to show image without split ?!

thanks.

When you mention a problem like this, it is best to mention what device and/or app you are using. Because you list an iPad as your device, it can be inferred that you are using iBooks and the answer to your question of why is because it is a bug in iBooks.

Now you can code your large images to take 100% of the screen and not spill over.

If this is not an ePub you've made, then it's a poorly made ePub given that the image i way too large for most reading situations.

dgatwood
01-20-2013, 07:32 PM
When you mention a problem like this, it is best to mention what device and/or app you are using. Because you list an iPad as your device, it can be inferred that you are using iBooks and the answer to your question of why is because it is a bug in iBooks.


The iPad I could believe, but I'd be very surprised if the reader were iBooks. In all of my testing, iBooks reliably pushes any image to the next page if it won't fit in its entirety, automatically scaling down the image if necessary to make it fit.

So again, what reader app, and can you post a snippet of HTML and any relevant CSS that reproduces the problem?

BTW, if you want to skip a few steps, the answer is probably

.bigimage {
max-width: 100%;
height: auto;
}

..

<img class="bigimage" ... />