MobileRead Forums - View Single Post

Turtle91 · 07-21-2015, 08:14 AM

Welcome to MR Forum!

You might want to try asking these types of questions in the Workshop area. This sub-forum is for Calibre specific questions.

For most book format's you could use the following:

Code:

<div class="whatever"><img alt="" src="../Images/example.jpg" /></div>

with CSS:
.whatever {width:100%; max-width:2015px} 
               *set max-width to the actual width of that image*
               *add any other styling to your preferences*

This will keep the aspect ratio and expand it to fill the <div> but will not stretch the image if the screen is too large - that prevents blurring of the image.

You could also try wrapping the image in SVG - but that is a bit more complicated and I've been told that not all devices support SVG all the time.

I hope that helps!

07-21-2015, 08:14 AM	#3
Turtle91 A Hairy Wizard Posts: 3,355 Karma: 20171571 Join Date: Dec 2012 Location: Charleston, SC today Device: iPhone 15/11/X/6/iPad 1,2,Air & Air Pro/Surface Pro/Kindle PW & Fire	Welcome to MR Forum! You might want to try asking these types of questions in the Workshop area. This sub-forum is for Calibre specific questions. For most book format's you could use the following: Code: <div class="whatever"><img alt="" src="../Images/example.jpg" /></div> with CSS: .whatever {width:100%; max-width:2015px} set max-width to the actual width of that image add any other styling to your preferences This will keep the aspect ratio and expand it to fill the <div> but will not stretch the image if the screen is too large - that prevents blurring of the image. You could also try wrapping the image in SVG - but that is a bit more complicated and I've been told that not all devices support SVG all the time. I hope that helps! Last edited by Turtle91; 07-21-2015 at 08:17 AM.