Quote:
Originally Posted by ElMiko
@ RbnJrg -- yeah, so setting html and body to 100% only works for an image (or, really, anything) that is intended to fit ONLY one page, right?
|
Exactly.
Quote:
If one were to insert the image amidst a whole chapter's worth of text, would it force all the text to fit in a single "screen" too?
|
On epub2, to insert an image amidst a whole chapter's worth of text it will create a blank space before the image and whose dimension will depend on the size of the image and where it was inserted. If you are going to insert those kind of images, then don't use html, body {100%} and instead of that use the alternative code I posted before:
a) In your .css stylesheet:
Code:
.myHeight {
height: 100%; /* ADE will work with this and will work because of the ADE's bug */
}
@supports (height: 99vh) { /* and QT ereader will use this; ADE will ignore this statement */
.myHeight {
height: 99vh;
}
}
b) In your .xhtml file:
Code:
<div class="myHeight">
<svg xmlns="http://www.w3.org/2000/svg" height="100%" preserveAspectRatio="xMidYMid meet" version="1.1" viewBox="0 0 XXX YYY" width="100%" xmlns:xlink="http://www.w3.org/1999/xlink">
<image height="YYY" width="XXX" xlink:href="../Images/cover.jpg"/>
</svg>
</div>
Of course, instead of 100% or 99vh (maybe is better 98vh or 95vh for full page images since this way you avoid the risk of generating an additional blank page) you can use any other height of your wish.
In epub3 the situation is distinct. You can force the image to float vertically, thus avoiding any white space because the space generated by the image's movement is occupied by text. But the code to achieve this is a bit different from the code used in epub2.