Quote:
Originally Posted by omnimodis78
How (if at all) would it be possible to ensure that all images are displayed at the same dimensions on the ereader as they appear in Calibre's ebook viewer window? Basically if I preview any given book through Calibre, images seem to be good, full sized, usually taking up an entire page, but on the ereader, same image is so tiny it might take up less than 10% of page space.  |
What I do is to modify the style wrapped around the image. For a full page image, I use a svg wrapper which will scale the image to fit within the page so it looks the same on any resolution display.
Code:
<style type="text/css">
@page {padding: 0pt; margin:0pt}
body { text-align: center; padding:0pt; margin: 0pt; }
</style>
</head>
<body class="nomargin">
<div class="svg_wrapper">
<svg xmlns="http://www.w3.org/2000/svg" height="100%" preserveAspectRatio="xMidYMid meet" version="1.1" viewBox="0 0 500 740" width="100%" xmlns:xlink="http://www.w3.org/1999/xlink">
<image height="740" width="500" xlink:href="../Images/cover.jpeg"></image>
</svg>
</div>
while for images within a page, I use a bit of css such as:
Code:
<p class="center"><img alt="" class="glyphw50" src="../Images/00022.jpg" /></p>
.glyphw33 {
margin : auto;
text-align : center;
height : auto;
width : 33%;
}
.glyphw50 {
margin : auto;
text-align : center;
height : auto;
width : 50%;
}
.glyphw75 {
margin : auto;
text-align : center;
height : auto;
width : 75%;
}
In the sample the image is displayed across 50% of the page with the height set to maintain the aspect ratio. The 33, 50 and 75% of the page width are arbitrary as they are the ones I find myself using most often.
Hope this is of some help to you.
Regards,
David