View Full Version : My cover image keep shrinking when opened on ibooks


krausj
05-02-2013, 08:37 AM
For some reason, when I open up my epub in iBooks, the cover image inside the book shows up 75% smaller. I don't think I changed much between when it was working fine and when it wasn't. I installed a new font, and reordered some things, that's about it. Here is what it looks like:

[Image deleted - MODERATOR]

it's dimensions are 738 by 983

Here is my manifest if that is any help:

<manifest>
<item id="toc" href="toc.ncx" media-type="application/x-dtbncx+xml"></item>
<!-- css -->
<item id="covercss" href="css/cover.css" media-type="text/css"></item>
<item id="copyright" href="css/f_copyright.css" media-type="text/css"></item>
<item id="css1" href="css/page1.css" media-type="text/css"></item>
<item id="css2" href="css/page2.css" media-type="text/css"></item>
<item id="css3" href="css/page3.css" media-type="text/css"></item>
<item id="cssstyles" href="css/styles.css" media-type="text/css"></item>


<!-- font -->
<item id="cambo" href="fonts/Cambo-Regular.otf" media-type="font/opentype"></item>



<!-- xhtml -->
<item id="item1" media-type="application/xhtml+xml" href="cover.xhtml"></item>
<item id="item2" media-type="application/xhtml+xml" href="f_copyright.xhtml"></item>
<item id="item3" media-type="application/xhtml+xml" href="page1.xhtml"></item>
<item id="item4" media-type="application/xhtml+xml" href="page2.xhtml"></item>
<item id="item5" media-type="application/xhtml+xml" href="page3.xhtml"></item>

<!-- images -->
<item id="cover" href="images/cover.jpg" media-type="image/jpeg"></item>
<item id="page1" href="images/page1.jpg" media-type="image/jpeg"></item>
<item id="page2" href="images/page2.jpg" media-type="image/jpeg"></item>
<item id="page3" href="images/page3.jpg" media-type="image/jpeg"></item>


</manifest>

Adjust
05-02-2013, 08:27 PM
open you image in an image editor and make the dimension 600x800px

in the cover.xhtml file

change the code to match this:

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>BookName</title>
</head>
<body id="toc_marker-1" style="margin-top:0px; margin-left:0px; margin-right:0px; margin-bottom:0px; text-align:center;" >
<div><img src="image/Cover.jpeg" alt="Cover.jpg" height="100%" />
</div>
</body>
</html>

krausj
05-03-2013, 08:01 AM
I followed your instructions, and I still have the same problem. tiny cover.
hmmmmmm

PageLab
05-03-2013, 09:31 AM
Considering the image you posted, we're talking about a fixed-layout ePUB here. In this case, you need to specify the viewport dimensions in the head of the XHTML file, as follows:


<meta name="viewport" content="width=738, height=983"></meta>


Don't specify the image size on the <img> tag itself, do it in the CSS. You also need to specify page dimensions in the CSS:


body {
width: 783px;
height: 983px;
}

img {
position: absolute;
height: 983px;
}

krausj
05-03-2013, 12:53 PM
Still not working. This is crazy!

krausj
05-03-2013, 02:40 PM
NVM!! I fixed it. I had installed a new font, went I went back to the old one everything worked. No clue why.