Sigil adding blank page after cover image

ebookn00b · 01-03-2013, 10:32 AM

I have created a xhtml page named cover and have inserted my cover image in this file. I have set the semantics for this html file as Cover and I have also gone into the image folder and added the semantic Cover Image to my cover image file. The cover image shows up on the iPad bookshelf as it should and it displays properly when the epub is opened but there is a blank page between the cover image and the first page with text in the book, which is a seperate html file of course. I have looked over the code and do not see anything that would cause this. Am I missing something? Did I do something wrong?

theducks · 01-03-2013, 10:45 AM

Yes/No/Maybe

We aren't deities.

You need to show us the code (from <head> to just past the first text that shows), the CSS sections for all classes referred in the code, AND the image size info.

Then we can make an informed comment.

BTW If it ONLY misbehaves on a single device family, the problem is probably a quirk. There may be a work-around. Calibre and Sigil use the same render engines, so the count is only 1 test.
(Quirky) ADE is a good test as many devices use that.

ebookn00b · 01-03-2013, 11:33 AM

So there was no blank page after the cover page in ADE. I went back and examined the code some more and for some reason Sigil was throwing in a &nbsp which was causing the iPad to display a blank page. I should have just viewed the ePub in ADE before posting. I just rarely view ePubs in ADE because of the way it sometimes displays things different than the iPad does. I proof everything directly on the device. Thank you!

theducks · 01-03-2013, 11:36 AM

I am in the Minority, but IMHO the image should NOT be 100% of the screen size, but something slightly less, just for those cases where 1 line pushes it over the edge.

mrmikel · 01-03-2013, 02:27 PM

In some readers, 100% of the screen size will cause to image to bleed onto the following page over the text with both displayed. Even 595 of 600 pixels can do it, so some care is required.

Dillinquent · 01-04-2013, 12:54 PM

Quote:

Originally Posted by theducks

I am in the Minority, but IMHO the image should NOT be 100% of the screen size, but something slightly less, just for those cases where 1 line pushes it over the edge.

I always set the cover image height to 95% for that very reason.

I have also found that putting the image in a <div> (with zero margin, set in CSS) rather than a <p> helps prevent blank pages.

JSWolf · 01-04-2013, 01:03 PM

Quote:

Originally Posted by ebookn00b

So there was no blank page after the cover page in ADE. I went back and examined the code some more and for some reason Sigil was throwing in a &nbsp which was causing the iPad to display a blank page. I should have just viewed the ePub in ADE before posting. I just rarely view ePubs in ADE because of the way it sometimes displays things different than the iPad does. I proof everything directly on the device. Thank you!

You are confusing the the iPad for the app you are using. Please do not say the iPad has a problem when it's not the iPad but the app.

In the future, instead of assume the iPad is the app you are using, just say the app you are using.

JSWolf · 01-04-2013, 01:05 PM

Quote:

Originally Posted by theducks

I am in the Minority, but IMHO the image should NOT be 100% of the screen size, but something slightly less, just for those cases where 1 line pushes it over the edge.

I have never had a problem with the image being 100% and this includes Bluefire and iBooks. What app/program are you using that causes a blank page with a 100% image height?

Ripplinger · 01-04-2013, 01:24 PM

Quote:

Originally Posted by JSWolf

I have never had a problem with the image being 100% and this includes Bluefire and iBooks. What app/program are you using that causes a blank page with a 100% image height?

Using Sigil I've had it happen with just bad code on my first book, probably happened by just dragging the image onto the page. I originally thought having the image at 100% of the screensize was the issue, but that didn't fix it. My Sony displays at 800x600 pixels.

This code forced a blank page after the cover:
<body>
<p class="sgc-1"><img alt="" src="../Images/image001.jpg" /> </p>
</body>

Removing the   so that the code read like this also forced a blank page after the cover:
<body>
<p class="sgc-1"><img alt="" src="../Images/image001.jpg" /></p>
</body>

Changing to this fixed the problem:
<body>
<div>
<svg xmlns="http://www.w3.org/2000/svg" height="100%" version="1.1" viewBox="0 0 443 747" width="100%" xmlns:xlink="http://www.w3.org/1999/xlink">
<image height="800" width="475" xlink:href="../Images/cover.jpeg"></image>
</svg>
</div>
</body>

Btw, the "  wasn't causing the blank page either, I even removed that at first thinking it was the problem, but even without it, it still always forced a blank page after the cover, and that blank page appeared in Calibre's viewer as well as on my ereader.

exaltedwombat · 01-06-2013, 12:12 PM

Quote:

Originally Posted by mrmikel

In some readers, 100% of the screen size will cause to image to bleed onto the following page over the text with both displayed. Even 595 of 600 pixels can do it, so some care is required.

Do you set "padding:0; margin:0" globally?

JSWolf · 01-06-2013, 07:03 PM

Quote:

Originally Posted by Ripplinger

Using Sigil I've had it happen with just bad code on my first book, probably happened by just dragging the image onto the page. I originally thought having the image at 100% of the screensize was the issue, but that didn't fix it. My Sony displays at 800x600 pixels.

This code forced a blank page after the cover:
<body>
<p class="sgc-1"><img alt="" src="../Images/image001.jpg" /> </p>
</body>

Changing to this fixed the problem:
<body>
<div>
<svg xmlns="http://www.w3.org/2000/svg" height="100%" version="1.1" viewBox="0 0 443 747" width="100%" xmlns:xlink="http://www.w3.org/1999/xlink">
<image height="800" width="475" xlink:href="../Images/cover.jpeg"></image>
</svg>
</div>
</body>

Btw, the "  wasn't causing the blank page either, I even removed that at first thinking it was the problem, but even without it, it still always forced a blank page after the cover, and that blank page appeared in Calibre's viewer as well as on my ereader.

What was the style sgc-1? That is probably the issue.

Oh and turn off tidy so it prevents making sgc-1 type styles.

Ripplinger · 01-06-2013, 07:12 PM

The sgc-1 was simply center and nothing else.
p.sgc-1 {text-align: center;}

The stylesheet for p had no top or bottom margins that might have done it.
p {
text-indent: 2em;
text-align: justify;
font-size: 1em;
margin-top:0;
margin-bottom:0;
}

I really couldn't see any reason for the blank page, but the other code didn't produce it, so I was happy with figuring that much out. Actually, I opened another book that didn't have the blank page after the cover and used that code, not that I figured it out on my own

.

JSWolf · 01-06-2013, 07:13 PM

Even if that had worked, you'd have the image off by 2em from center.

Ripplinger · 01-06-2013, 07:19 PM

Yes, it was a really early copy of the book that I saved just to see previous screwups hehe... but it's not really noticeable for the image. But that 2em wouldn't force the blank page after the cover though.

It's funny that when I have centered text that happens to have code shifting it a bit to the right, it sticks out like a sore thumb to me and I can't stand to leave it that way, I adjust the code for it. But I really don't notice the difference on an image.

GrannyGrump · 01-06-2013, 11:36 PM

After being bugged by off-center images, I finally figured it out to add text-indent:0 to stylings for images. I wish it would be that way by default when you use "center", but oh well, live and learn.

Theducks said

Quote:

IMHO the image should NOT be 100% of the screen size, but something slightly less

. I agree with this. When I first started fooling with epub, the only viewer I had was the Calibre Reader, and the cover image would always need two page-turns to advance to the next page. By trial and error, I learned to set the height to 99% and had no more trouble with the reader. I continue to do that as an habitual CYA.

01-03-2013, 10:32 AM	#1
ebookn00b Member Posts: 19 Karma: 10 Join Date: Apr 2012 Device: Kindle Fire, iPad 2	Sigil adding blank page after cover image I have created a xhtml page named cover and have inserted my cover image in this file. I have set the semantics for this html file as Cover and I have also gone into the image folder and added the semantic Cover Image to my cover image file. The cover image shows up on the iPad bookshelf as it should and it displays properly when the epub is opened but there is a blank page between the cover image and the first page with text in the book, which is a seperate html file of course. I have looked over the code and do not see anything that would cause this. Am I missing something? Did I do something wrong?

01-06-2013, 07:19 PM	#14
Ripplinger 350 Hoarder Posts: 3,574 Karma: 8281267 Join Date: Dec 2010 Location: Midwest USA Device: Sony PRS-350, Kobo Glo & Glo HD, PW2	Yes, it was a really early copy of the book that I saved just to see previous screwups hehe... but it's not really noticeable for the image. But that 2em wouldn't force the blank page after the cover though. It's funny that when I have centered text that happens to have code shifting it a bit to the right, it sticks out like a sore thumb to me and I can't stand to leave it that way, I adjust the code for it. But I really don't notice the difference on an image. Last edited by Ripplinger; 01-06-2013 at 07:37 PM.

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Page blank before and after book image page	osiris12	Sigil	12	05-28-2015 04:27 PM
Image (was Sigil) creates a blank page	p3aul	ePub	3	09-26-2012 10:17 AM
iPad I found the uwnated blank pages before and after for each full-page image on iPad.	Vengadesan	Apple Devices	1	07-07-2011 01:23 AM
[Old Thread] epub -> mobi conversion; blank page after image	joubert	Calibre	10	03-07-2011 05:26 PM
Adding cover image	miwie	Library Management	9	03-04-2011 10:39 AM

01-03-2013, 10:45 AM	#2
theducks Well trained by Cats Posts: 30,887 Karma: 59840450 Join Date: Aug 2009 Location: The Central Coast of California Device: Kobo Libra2,Kobo Aura2v1, K4NT(Fixed: New Bat.), Galaxy Tab A	Yes/No/Maybe We aren't deities. You need to show us the code (from <head> to just past the first text that shows), the CSS sections for all classes referred in the code, AND the image size info. Then we can make an informed comment. BTW If it ONLY misbehaves on a single device family, the problem is probably a quirk. There may be a work-around. Calibre and Sigil use the same render engines, so the count is only 1 test. (Quirky) ADE is a good test as many devices use that.

01-03-2013, 11:33 AM	#3
ebookn00b Member Posts: 19 Karma: 10 Join Date: Apr 2012 Device: Kindle Fire, iPad 2	So there was no blank page after the cover page in ADE. I went back and examined the code some more and for some reason Sigil was throwing in a &nbsp which was causing the iPad to display a blank page. I should have just viewed the ePub in ADE before posting. I just rarely view ePubs in ADE because of the way it sometimes displays things different than the iPad does. I proof everything directly on the device. Thank you!

01-03-2013, 11:36 AM	#4
theducks Well trained by Cats Posts: 30,887 Karma: 59840450 Join Date: Aug 2009 Location: The Central Coast of California Device: Kobo Libra2,Kobo Aura2v1, K4NT(Fixed: New Bat.), Galaxy Tab A	I am in the Minority, but IMHO the image should NOT be 100% of the screen size, but something slightly less, just for those cases where 1 line pushes it over the edge.

01-03-2013, 02:27 PM	#5
mrmikel Color me gone Posts: 2,089 Karma: 1445295 Join Date: Apr 2008 Location: Central Oregon Coast Device: PRS-300	In some readers, 100% of the screen size will cause to image to bleed onto the following page over the text with both displayed. Even 595 of 600 pixels can do it, so some care is required.

01-06-2013, 07:12 PM	#12
Ripplinger 350 Hoarder Posts: 3,574 Karma: 8281267 Join Date: Dec 2010 Location: Midwest USA Device: Sony PRS-350, Kobo Glo & Glo HD, PW2	The sgc-1 was simply center and nothing else. p.sgc-1 {text-align: center;} The stylesheet for p had no top or bottom margins that might have done it. p { text-indent: 2em; text-align: justify; font-size: 1em; margin-top:0; margin-bottom:0; } I really couldn't see any reason for the blank page, but the other code didn't produce it, so I was happy with figuring that much out. Actually, I opened another book that didn't have the blank page after the cover and used that code, not that I figured it out on my own .

01-06-2013, 07:13 PM	#13
JSWolf Resident Curmudgeon Posts: 78,973 Karma: 144284074 Join Date: Nov 2006 Location: Roslindale, Massachusetts Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3	Even if that had worked, you'd have the image off by 2em from center.

Advert

Advert