Wrangling covers for ePub - Page 2

RbnJrg · 12-02-2013, 09:29 AM

Quote:

Originally Posted by Jellby

How does it look in landscape orientation?

Excelent question!

RbnJrg · 12-02-2013, 09:38 AM

Quote:

Originally Posted by MacEachaidh

No mate, not so. The "none" image is exactly the size of the screen (not exceeding the width, as I can tell by patterning in the image), and the "meet" image is narrower. (I may not know about the code involved, but I'm not unobservant.)

Yep, already am.

I think I'll just stick with the "none". ;-)

Maybe there is something (a style, properties for <body>) in your stylesheet that is affecting the SVG display. Try once more now using all this code:

Code:

<body>
  <div style="text-align: center; padding: 0pt; margin: 0pt;">
    <svg xmlns="http://www.w3.org/2000/svg" height="100%" preserveAspectRatio="xMidYMid meet" version="1.1" viewBox="0 0 1080 1440" width="100%" xmlns:xlink="http://www.w3.org/1999/xlink">
      <image height="1440" width="1080" xlink:href="../Images/CoverDesign.jpg"></image>
    </svg>
  </div>
</body>

Also be sure that the .html file where is going that code IS NOT LINKED WITH YOUR STYLESHEET

Quote:

How does it look in landscape orientation?

I haven't tried/ Why do you ask?

Because by using preserveAspectRatio="none" in landscape mode you'll have a completly distorted cover image.

MacEachaidh · 12-02-2013, 10:06 AM

Quote:

Originally Posted by RbnJrg

Maybe there is something (a style, properties for <body>) in your stylesheet that is affecting the SVG display.

There's nothing else referencing the SVG, and no other values or properties for <body>, other than the code you (and I) have used.

Quote:

Because by using preserveAspectRatio="none" in landscape mode you'll have a completly distorted cover image.

But what has that to do with whether it's filling the screen in portrait mode?

The "meet" setting doesn't fill the screen in portrait mode. Either one I use will look inappropriate in one orientation.

Jellby · 12-02-2013, 10:44 AM

Quote:

Originally Posted by MacEachaidh

But what has that to do with whether it's filling the screen in portrait mode?

Let's step back a bit.

In general you have to choose between:

a. Have your cover image perfectly fit the screen, both horizontally and vertically. It will be stretched or shrinked if the proportions are not exactly as needed, maybe not very noticeable if the difference is small.

b. Keep the aspect ratio of the cover unchanged, enlarge or reduce the image evenly. If the proportions are exactly as required, it will exactly fill the screen, otherwise you'll have either some white space or parts of the image will be trimmed.

"none" is "a", "meet" or other choices are "b". The question about landscape was meant to underline that, although "a" might look good enough in portrait mode, it's likely to be a disaster in landscape mode.

Now, your problem with portrait mode, if there's nothing wrong with the code or the reader's behaviour, is that the dimensions of the image are not exactly those needed to fill the screen, probably because the screen is not exactly what you think it is. You didn't answer to my question about the status bar, is there anything else that's using up some of the screen space?

Quote:

The "meet" setting doesn't fill the screen in portrait mode. Either one I use will look inappropriate in one orientation.

Yes, there's no "perfect fit" for everything. What you have to choose is what to do when it is not perfect. To most of us, having white space is preferable to having a stretched out image.

Could you try with this attached image? It's just a 1400×1080 image, with a frame (so you can see whether it's trimmed or there's "white space" around it) and an exact square inside (so you can measure it with a ruler and see if it remains truly a square).

DaleDe · 12-02-2013, 11:22 AM

There is a third choice. The image can be cropped to fit. Aspect ratio is maintained perfectly but some edges may be trimmed if necessary. This is useful is there no important graphics or text near the edge of the screen.

Dale

Jellby · 12-02-2013, 12:12 PM

Quote:

Originally Posted by DaleDe

There is a third choice. The image can be cropped to fit.

That's included in "b": [...] you'll have either some white space or parts of the image will be trimmed.

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Are Two EPUB Covers possible?	DapperDG	ePub	3	05-16-2013 01:56 PM
Epub covers	drmar	Recipes	1	03-03-2012 06:15 AM
How to get ePub covers to display?	Antioch	ePub	4	06-25-2011 03:00 AM
Why no Covers in ePub from Kobobooks?	hpjrt	Kobo Reader	7	12-18-2010 12:38 AM
epub covers quirk? with 0.7.2	Allis	Calibre	4	06-24-2010 08:22 PM

12-02-2013, 11:22 AM	#20
DaleDe Grand Sorcerer Posts: 11,470 Karma: 13095790 Join Date: Aug 2007 Location: Grass Valley, CA Device: EB 1150, EZ Reader, Literati, iPad 2 & Air 2, iPhone 7	There is a third choice. The image can be cropped to fit. Aspect ratio is maintained perfectly but some edges may be trimmed if necessary. This is useful is there no important graphics or text near the edge of the screen. Dale