View Single Post
Old 09-28-2012, 03:08 PM   #24
eggheadbooks1 doesn't littereggheadbooks1 doesn't litter
Posts: 83
Karma: 178
Join Date: Apr 2011
Device: Kindle Fire, Kobo Touch, Aldiko for Android
Hi Jellby:

This is the code we eventually came up with:

<div class="Main" style="text-align: center;">
  <svg style="max-width:300px; max-height:600px"
 xmlns="" height="100%" width="100%"
 preserveAspectRatio="xMidYMid meet" version="1.1" viewBox="0 0 300 600"
 xmlns:xlink="" ><image height="600" width="300"
It works great in that it achieves its objective of downsizing images on small screens while limiting the potential upsizing of small images beyond their native dimensions, and it allowed me to center the images, but all surrounding text is pushed off screen. So something like my logo on my title page I have had to simply set a fixed pixel dimension. I can also do a percentage of screen height.

When I first did these tests, I had only images in my test file. Two small images would display together on the screen so I did not imagine that surrounding text would not behave the same way. Wrong. The SVG wrapper is essentially behaving like text jump text wrap.

If there's nothing that can be done, so be it. It's still the lesser of two evils. But if there is a way to fix this that would be great.
eggheadbooks1 is offline   Reply With Quote