Well, FWIW, I use this in the cover.xhtml file:
Code:
<body class="cover">
<h1 style="display:none">Forside</h1>
<div class="svg_outer">
<div class="svg_inner">
<svg xmlns="http://www.w3.org/2000/svg" height="100%" preserveAspectRatio="xMidYMid meet" version="1.1" viewBox="0 0 900 1200" width="100%" xmlns:xlink="http://www.w3.org/1999/xlink">
<image height="1200" width="900" xlink:href="../Images/cover.jpg"/>
</svg>
</div>
</div>
</body>
and this in my style.css:
Code:
.cover {
margin:0;
padding: 0;
border-width: 0;
}
.svg_outer {
display: block;
margin-bottom: 0;
margin-left: 0;
margin-right: 0;
margin-top: 0;
padding-bottom: 0;
padding-left: 0;
padding-right: 0;
padding-top: 0;
text-align: left;
}
.svg_inner {
display: block;
text-align: center;
}
which sort of works on most devices. But then again, we are producing general epubs for use on many devices, not ipad specific ones. And I much prefer to se a full, non-distorted image that may or may not fill the screen, to one, that fills out the screen, but is more or less unrecognisable. Each to his own ...
I don't think, there's any fool-proof way, that works on all and everything, but you might try a look at Liz Castros blog (she produces epubs for ipad exclusively):
http://www.pigsgourdsandwikis.com/20...-ereaders.html
Regards.
Kim