View Full Version : iBooks cutting off the edges of images


radiocure
01-12-2012, 10:33 PM
Sorry if this is elementary, but I can't seem to resolve it, and it's driving me a bit crazy.

I've got some recent e-books with rather large illustrations, which I'm inserting just like this:

<img src="images/whatever.jpeg" width="100%" alt="something" />

Across all devices there are no issues, but in iBooks the righthand 10 pixels or so are just cut off. Does anyone know what I'm missing?

Thanks a great deal ahead of time. Sorry if this has been covered, but I searched and couldn't find anything relevant.

whbenson
01-18-2012, 06:53 PM
First, AFAIK, iBooks ignores the width property altogether on the img tag.

But... I was finally able to reproduce what you're seeing by putting "width:100%" on the <body> tag! So maybe you're inadvertently doing something similar?? If so, then just use the default width -i.e. don't use the width property at all.

More details and a few example are at
http://empiricalepub.blogspot.com/2012/01/ibooks-body-margin-contortions.html

-Bill

TravellingTwo
02-01-2012, 01:59 PM
Did anyone manage to fix this problem? We have the same issue but can't figure out what the fix is.

radiocure
02-04-2012, 07:46 PM
Did anyone manage to fix this problem? We have the same issue but can't figure out what the fix is.

Doesn't seem to be an issue in this case with the <body> tag.

I have had luck putting the image in its own <div>, which solved the problem for most of the images but still leaves a bit (though less) clipped off on some of the images. I have not seen a better solution offered anywhere else, but have seen others post similar problems.

whbenson
02-06-2012, 01:18 PM
Putting the image in its own <div> is the received wisdom, which has always worked for me. Can you post a small, short, non-drm example showing the problem? Pointers to others with similar problems?
-Bill