Quote:
Originally Posted by Siavahda
Thank you both for explaining! But why does image-full will override fullpage-image mess up the image in this case? If the height is set to auto when width is 100%, shouldn't that functionally be the same as setting the height at 100% too?
I like the look of your svg wrapper! I'll try using that going forward when I need to make edits. Thanks!
|
Cascading... The last entry will override earlier entries in the chain. The width 100% sets the width to 100% and the height auto will simply set whatever height is needed to display the full width without changing the aspect ratio even if that height exceeds the page height. What you would need is something like:
fullscreen_img {
max-width: 100%
max-height: 100%
}
For ePub3, I would use:
fullscreen_img {
width: 100vw;
height: 95vh;
object-fit: contain;
}
The 95vh allows for top and bottom margins which are not removable in most renderers.