[QUOTE=Abekonge;2825193]For tall thin images or tall images with captions I use the following CSS. It should work uniformly on ADE and iBooks and other
And this CSS:
Code:
div.tallImage {
width:80%;
height:auto;
page-break-inside: avoid;
margin-left:10%;
}
img {
max-width:100%;
height:auto;
}
It's true, putting the max-height on the p tag will only work for images without captions. My question is how do you work out, apart from extensive trial and error, the optimum width for the image. Also note, kindle fires have a different screen proportion in width and height to an ipad. It seems images are more likely to break on an iPad when in landscape mode, and it would be nice to have a full proof method of stopping them break without have to guestimate the necessary width of the image to fill as much of the screen as possible without causing it to break.
What if you put 'Max-height:100%;' under the img tag above, instead of max-width?