svg in file preview pane

Thom* · 11-04-2015, 04:17 PM

Why is it that when I set the "svg Viewport" height above 96% that the height of the image will not fit in the file preview pane? I believe the default viewport height is 100%.

When I leave the viewport at default I get a vertical schrollbar in the preview pane. I would think that it would fit nicely just filling the pane as it does horizontally.

Code:

<body>
    <svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100% 100%" preserveAspectRatio="xmidymid">

    <image width="100%" height="100%" xlink:href="cover.jpeg"/>

  </svg>

</body>

When I reduce the height of the viewport to 96%, the schrollbar goes away and the the image fits into the preview pane nicely.

Code:

<body>
    <svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" height="96.7%" viewBox="0 0 100% 100%" preserveAspectRatio="xmidymid">

    <image width="100%" height="100%" xlink:href="cover.jpeg"/>

  </svg>

</body>

Although it is a minor issue, it just leaves me puzzled.

theducks · 11-04-2015, 05:27 PM

If you are adding a Cover, why not use the Add Cover tool?
It makes a proper coverpage, with all the required entries.

BTW
Page margins can apply to covers depending on links or settings.
100% of the screen area is seldom available

Thom* · 11-04-2015, 08:39 PM

I can find nothing in the book that would set the padding or the margins. In fact, another book specifically sets both padding and margins to 0px at the "page" level and at the "body" level (both levels). And the file preview panel still will not contain the image without a vertical scroll bar.

Since the book itself does not seem to be causing this, it must be the reader (in this case the file preview panel). I could not find a way to set the default padding and margins for the file preview panel.

But then, the file preview panel is not the final destination for the book. It is only a "preview", so I guess it doesn't really matter.

Still puzzling though.

theducks · 11-04-2015, 09:17 PM

Quote:

Originally Posted by Thom*

I can find nothing in the book that would set the padding or the margins. In fact, another book specifically sets both padding and margins to 0px at the "page" level and at the "body" level (both levels). And the file preview panel still will not contain the image without a vertical scroll bar.

Since the book itself does not seem to be causing this, it must be the reader (in this case the file preview panel). I could not find a way to set the default padding and margins for the file preview panel.

But then, the file preview panel is not the final destination for the book. It is only a "preview", so I guess it doesn't really matter.

Still puzzling though.

You can't find the CSS?
If you WANT 0, set margin to 0. If the entry is NOT THERE, ADD IT

Viewers have defaults that are not always ZERO

kovidgoyal · 11-04-2015, 10:36 PM

The preview panel is a web browser, webkit to be precise. Use the inspect element tool (right click on the image) then look under the metrics tab, you will likely find the containing element of the SVG image is ~5 pixels larger than the SVG element itself. I have no idea why that is, you'd have to ask the WebKit developers. Probably some hidden start/end padding for the body or html elements.

Thom* · 11-05-2015, 09:20 AM

Interesting. Thank you for looking into it.

Calibre is still the best.

11-04-2015, 04:17 PM	#1
Thom* The Fumbler Posts: 66 Karma: 10 Join Date: Jun 2015 Device: android 4.2/fbreader	svg in file preview pane Why is it that when I set the "svg Viewport" height above 96% that the height of the image will not fit in the file preview pane? I believe the default viewport height is 100%. When I leave the viewport at default I get a vertical schrollbar in the preview pane. I would think that it would fit nicely just filling the pane as it does horizontally. Code: <body> <svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100% 100%" preserveAspectRatio="xmidymid"> <image width="100%" height="100%" xlink:href="cover.jpeg"/> </svg> </body> When I reduce the height of the viewport to 96%, the schrollbar goes away and the the image fits into the preview pane nicely. Code: <body> <svg xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" height="96.7%" viewBox="0 0 100% 100%" preserveAspectRatio="xmidymid"> <image width="100%" height="100%" xlink:href="cover.jpeg"/> </svg> </body> Although it is a minor issue, it just leaves me puzzled. Last edited by Thom; 11-04-2015 at 04:40 PM.*

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Font size in Book View / Preview Pane	Notjohn	Sigil	4	10-12-2015 10:17 AM
Preview pane is misbehaving	Notjohn	Sigil	8	10-02-2015 05:59 AM
Live preview pane now floating	Arkadian	Editor	2	09-15-2014 06:27 PM
File Preview Pane missing	Telyt	Editor	2	08-18-2014 01:15 PM
Mobipocket preview pane	Argel	Kindle Formats	4	06-17-2008 12:15 PM

11-04-2015, 05:27 PM	#2
theducks Well trained by Cats Posts: 29,805 Karma: 54830978 Join Date: Aug 2009 Location: The Central Coast of California Device: Kobo Libra2,Kobo Aura2v1, K4NT(Fixed: New Bat.), Galaxy Tab A	If you are adding a Cover, why not use the Add Cover tool? It makes a proper coverpage, with all the required entries. BTW Page margins can apply to covers depending on links or settings. 100% of the screen area is seldom available

11-04-2015, 08:39 PM	#3
Thom* The Fumbler Posts: 66 Karma: 10 Join Date: Jun 2015 Device: android 4.2/fbreader	I can find nothing in the book that would set the padding or the margins. In fact, another book specifically sets both padding and margins to 0px at the "page" level and at the "body" level (both levels). And the file preview panel still will not contain the image without a vertical scroll bar. Since the book itself does not seem to be causing this, it must be the reader (in this case the file preview panel). I could not find a way to set the default padding and margins for the file preview panel. But then, the file preview panel is not the final destination for the book. It is only a "preview", so I guess it doesn't really matter. Still puzzling though.

11-04-2015, 10:36 PM	#5
kovidgoyal creator of calibre Posts: 43,860 Karma: 22666666 Join Date: Oct 2006 Location: Mumbai, India Device: Various	The preview panel is a web browser, webkit to be precise. Use the inspect element tool (right click on the image) then look under the metrics tab, you will likely find the containing element of the SVG image is ~5 pixels larger than the SVG element itself. I have no idea why that is, you'd have to ask the WebKit developers. Probably some hidden start/end padding for the body or html elements.

11-05-2015, 09:20 AM	#6
Thom* The Fumbler Posts: 66 Karma: 10 Join Date: Jun 2015 Device: android 4.2/fbreader	Interesting. Thank you for looking into it. Calibre is still the best.

Advert

Advert