Quote:
Originally Posted by AndrewH
That's not working, either. 
If it makes any difference, my image is 429 x 750, so the only changes in Jon's code I pasted above is this line:
Code:
<image height="750" width="429" xlink:href="../Images/3.png"></image>
edit: With some creative editing, I managed to get the images 600x800 so it looks right. This all would have been much easier if the <center> tag wasn't deprecated in HTML. |
If the image is 429x750, making it fill a 600x800 screen is not correct. That just makes the images look off because they are off.
This is the correct code you want to use...
Code:
<?xml version='1.0' encoding='utf-8'?>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="calibre:cover" content="true"/>
<title>Cover</title>
<style type="text/css" title="override_css">
@page {padding: 0pt; margin:0pt}
body { text-align: center; padding:0pt; margin: 0pt; }
</style>
</head>
<body>
<div>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="100%" height="100%" viewBox="0 0 429 750" preserveAspectRatio="xMidYMid meet">
<image width="429" height="750" xlink:href="../Images/3.png"/>
</svg>
</div>
</body>
</html>
That will work on a T1 no problem.