Quote:
Originally Posted by JSWolf
RbJrg's code is not ePub2 compatible. You have to change height: 99vh; to height: 99%; to be ePub2 compatible.
|
Oddly enough, it is compatible. The 99vh is not compatible with ePub2 but if you look at the posts about RbnJrg's code please note the comments about which parts are ePub2 and which are ePub3 (for convenience, I bolded them):
Code:
.cover {
margin: 0;
height: 99vh; /* This property is for epub3 */
max-width: 100%; /* This property is for epub3 */
overflow: hidden !important;
}
.picWrapper {
margin: 0;
padding: 0;
height: 100%; /* This property is for epub3 */
}
.pic { /* This is the epub2 layer */
display: block;
margin: auto;
width: 100%;
position: absolute;
top: 0; bottom: 0; left: 0; right: 0;
}
The code used in the xhtml file would be:
Code:
<body class="cover">
<div class="picWrapper">
<svg class="pic" xmlns="http://www.w3.org/2000/svg" height="100%" preserveAspectRatio="xMidYMid meet" version="1.1" viewBox="0 0 1000 1500" width="100%" xmlns:xlink="http://www.w3.org/1999/xlink"><image height="1500" width="1000" xlink:href="../Images/cover.jpeg"/></svg>
</div>
</body>