[RbnJrg]

Originally Posted by RbnJrg

Ok, I think I know the cause of your issue. Right know I can't give a solution because I'm not in my home but in my next post I'll attach you an epub with the proper code to insert and style a svg image.

Ok, after what you wrote now I can understand the source of your issue. In effect, if you don't specify the width of your image, the e-reader will use the size embedded in the svg image. And in the present case, the size of your "Canada" (with the flag) text is very tiny; it just is 73px by 17px. Of course, if you open that image in Illustrator or Inkscape, you'll see it big but actually is a small one (just as big as the text Canada with a font-size of 1em). And when you set the size of an image, if you are going to do it by styling in-line (i.e <img style="width: 60pt" .../> is easier to do it of the following way:

<img width="60pt" .../>

or if you are going to use px, then

<img width="60" .../>

You don't need to set the height (unless you want a distorted image). But the best way to style an image maybe is of the following manner:

<p><img class="svg" .../></p>

I wrote a small epub with the following code:

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla ac tellus nunc. Phasellus imperdiet leo metus, et gravida lacus. Donec metus ligula, elementum at pellentesque pellentesque, suscipit ac nunc. Etiam lobortis, massa ac aliquam auctor, augue nisl sagittis urna, at dapibus tellus erat ullamcorper ligula. Praesent orci dui, pulvinar id convallis a, faucibus non mauris. Donec tellus augue, tempus sed facilisis sed, fringilla quis leo.</p>

<p><img class="svg" alt="Temp" src="../Images/Temp.svg"/></p>

<p>Mauris vulputate, leo ac facilisis vulputate, enim orci interdum augue, in blandit quam turpis quis dui. Morbi dictum luctus velit nec faucibus. Cras vitae tortor purus, ut tincidunt mauris. Sed at velit nisl. Donec eu mauris tortor, interdum condimentum erat. Nam egestas turpis eget nibh laoreet pharetra. Suspendisse a sem eros, ut pulvinar enim. In sed elit eu nulla accumsan tincidunt eget sit amet ipsum. Nullam ut massa rutrum dolor placerat tempor accumsan eget purus.</p>

and in the .css stylesheet I used:

p {
   font-size: 1em;
   margin: 0;
   text-align: justify;
}

.svg {
   font-size: 1em; /*This is important, you need to set a font-size*/
   width: 10em;
   height: auto;
   padding: 1em 0;
}

This is how it looks under ADE:



Google Books is based on ADE so I think the things should go well with the previous code. Of course, instead of a width of 10em you can use the width of your wish, but always in "em".

Below you can check the respective epub.

Regards
Rubén

EDIT: By chance, are you working under epub3?