Problem with images in ADE

Land_Outcast · 05-25-2020, 02:40 AM

Hey there, I've got this weird problem in which two images, same class, similar dimensions, both inside <p></p>, both at the end of their HTMLXs, are rendered terribly different by ADE (one is rendered the correct size, the other is minuscule).

Land_Outcast · 05-25-2020, 02:51 AM

Solved. Html height:100% was the culprit; though I'd like to know why.

Jellby · 05-25-2020, 03:55 AM

Unless you have the <img> in another element with fixed height, "height: x%" is undefined. What you probably want is "max-height: 100vh", but that's not required for ePub 2 support (i.e. don't rely on it).

Land_Outcast · 05-25-2020, 06:13 PM

Of course, "height" references the height of the parent. But if it is not defined it's as good as nothing

I just tested it within a <div style="text-align:center; height:400px">, and it behaved as it should, even with the html {height:100}. I could even use a <p style="text-align:center; height:400px">. But of course, then the image dimensions would be fixed, and I don't want that.
Thank you, Jellby.

05-25-2020, 02:40 AM	#1
Land_Outcast Enthusiast Posts: 43 Karma: 100000 Join Date: Jun 2018 Device: none	Problem with images in ADE Hey there, I've got this weird problem in which two images, same class, similar dimensions, both inside <p></p>, both at the end of their HTMLXs, are rendered terribly different by ADE (one is rendered the correct size, the other is minuscule). Attached Thumbnails

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
images not displayed in iBooks and ADE	xmlgirl	ePub	16	06-07-2015 06:08 AM
Altering HTML Script To Properly Display Background Images In ADE Ereaders.	Turk.Turkleton	Sigil	16	09-25-2012 12:34 PM
Book images show up Sony and ADE. but not on my Kobo.	beautifulsoup	Kobo Reader	13	01-06-2012 01:02 AM
Hyperlinked images don't work in ADE	hpstricker	ePub	6	11-26-2010 06:38 PM
ePub, ADE and Images puzzle	pdurrant	ePub	11	09-05-2009 10:02 AM

05-25-2020, 02:51 AM	#2
Land_Outcast Enthusiast Posts: 43 Karma: 100000 Join Date: Jun 2018 Device: none	Solved. Html height:100% was the culprit; though I'd like to know why.

05-25-2020, 03:55 AM	#3
Jellby frumious Bandersnatch Posts: 7,516 Karma: 18512745 Join Date: Jan 2008 Location: Spaniard in Sweden Device: Cybook Orizon, Kobo Aura	Unless you have the <img> in another element with fixed height, "height: x%" is undefined. What you probably want is "max-height: 100vh", but that's not required for ePub 2 support (i.e. don't rely on it).

05-25-2020, 06:13 PM	#4
Land_Outcast Enthusiast Posts: 43 Karma: 100000 Join Date: Jun 2018 Device: none	Of course, "height" references the height of the parent. But if it is not defined it's as good as nothing I just tested it within a <div style="text-align:center; height:400px">, and it behaved as it should, even with the html {height:100}. I could even use a <p style="text-align:center; height:400px">. But of course, then the image dimensions would be fixed, and I don't want that. Thank you, Jellby.