MobileRead Forums - View Single Post - How to make SVG scale properly vertically?

SBT · 03-29-2012, 04:26 AM

I have some standard decorations in SVG I wish to include in an epub. I load them as an <OBJECT> inside a <DIV>, and scale the <DIV> with eg. width="50%".
In Chrome the width and height are scaled properly; in ADE and Calibre viewer the width (& aspect ratio) is OK, but there is a lot of vertical padding. Anybody know how to get rid of it?

the xhtml code is:

Code:

<div style="width:50%">
    <object data="svg/doodle.svg" type="image/svg+xml" ></object>
</div>

The svg file headers are:

Code:

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
  "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg"
     viewBox="40 70 290 90">
  <path id="....

03-29-2012, 04:26 AM	#1
SBT Fanatic Posts: 580 Karma: 810184 Join Date: Sep 2010 Location: Norway Device: prs-t1, tablet, Nook Simple, assorted kindles, iPad	How to make SVG scale properly vertically? I have some standard decorations in SVG I wish to include in an epub. I load them as an <OBJECT> inside a <DIV>, and scale the <DIV> with eg. width="50%". In Chrome the width and height are scaled properly; in ADE and Calibre viewer the width (& aspect ratio) is OK, but there is a lot of vertical padding. Anybody know how to get rid of it? the xhtml code is: Code: <div style="width:50%"> <object data="svg/doodle.svg" type="image/svg+xml" ></object> </div> The svg file headers are: Code: <?xml version="1.0" encoding="UTF-8" standalone="no"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="40 70 290 90"> <path id="....