Quote:
Originally Posted by etrnlflame
For some reason Calibre isn't resizing my images when I convert a .docx to an epub format. All of the forums that I find say it will automatically resize, but I've tried .png .jpg and .svg versions of the same image and they haven't been resizing. Instead they appear off the page. This doesn't really help, considering the main problem-image is a map.
The images will resize on an iPhone, iPad and MacOS iBooks, but not a Kobo ereader, even though the output type is set to Kobo.
My book is a novel with only black and white images and reflowable text. Help would be appreciated!
|
Calibre only resizes the image file, it doesn't change the CSS or HTML styles for the images. This means that the image will only be displayed at the resized size if there are no CSS or HTML styles affecting the size. If the size is being set in CSS or HTML then all that happens is that the downsized image gets scaled up again resulting in a poor quality rendering on screen.
First of all don't set the output type to "Kobo", because this refers to the original ancient Kobo devices that had extremely low resolution screens. Instead use "Tablet" so that the image file doesn't get resized.
Second, you will usually need to edit the CSS or HTML styles so that the image displays at the size you want. E.g. if you want a map to fill the avaliable screen (i.e. changing the aspect ratio to match the available screen) then use
height:100%; width:100%; for the img object. Or if you want to display the image as large as will fit on the screen but retaining the original aspect ratio then use
height:100%; width:auto; max-width:100%; for images with a taller aspect ratio than the screen, or
height:auto; max-height:100%; width:100%; for images with a wider aspect ratio than the screen. Alternatively you can use <svg> styles to resize the image which gives more control than <img>.
(If you don't care about the aspect ratio and the only problem is that the images are too big for the screen then you might get away with just adding
img {max-height:100%; max-width:100%;} to the book's stylesheet.)