Quote:
Originally Posted by Turtle91
Kindle preview is a little quirky, plus there is an actual conversion process from ePub to the proprietary kindle format (not ePub). I'd recommend loading it onto the kindle itself for checking.
MY guess...based on old information... is that the kindle previewer may be hanging up on the position:fixed. IIRC the older kindles didn't support that but now do. Kindle previewer may have not been updated???
If you see the same problem on an actual kindle then you can try using this instead:
Code:
div.v-ctr {height:100vh; width:100vw; display:table}
If that doesn't fix it, then I have officially exhausted my knowledge of Kindle quirks. Maybe someone else knows more? |
Your answer is a very good one. The OP issue under Kindle is due to you are using the property "height: 100%". That value only will work if also is set
html, body { height:100% }
Of course, with those values, only it will be showed the first page of the xhtml file, so only should be employed for a title page or similar. To avoid this issue the best is to employ -as you indicate it- height: 100vh (avoiding so html, body {100%}) but the problem now is that vh very probably won't be honored by epub2 ereaders. In some cases, when a table can't be employed, the best under epub2 is to use a svg wrapper. We have to set the height in px (for example 600 x 800), and the property preserveaspectratio="XMidYMid meet" will do all the hard work. To write the text (one can do it by hand, of course) the easiest way is to use Inkscape (all the code for the svg can be generated with Inkscape, also the size of the svg).