[verydeepwater]

Being frequently plagued by the problem of images breaking over the page in iPad and on kindle, I am looking for the best way to avoid this.

I place the images in div tags with the css rules:
page-break-inside:avoid !important; and as appropriate with
page-break-before:always; and /or
page-break-after:always ;

But if the image is tall and thin, there is always the possibility that it will break over to the next page, especially in landscape. It seems to help if the image is of similar proportions to the screen e.g. 860px by 600px but this is not always the case.

For large images, I have also tried using :
}
img
{
max-height:97%;
}

Nothing seems to be full proof, i wonder if anyone has better ideas how to prevent images breaking.