sawa
sawa

Reputation: 168071

How to embed a SVG object filling the container element

I have a SVG file file.svg (converted from a pdf) embedded in a DOM object (td element). I want it to stretch to fill the container element. I tried

<td><object data="file.svg" type="image/svg+xml" max-width="100%"></object></td>

which displays it too big (probably the size of the default size of the file), and if I do

<td><object data="file.svg" type="image/svg+xml" width="100%"></object></td>

then it displays too small. What is the correct way to set the size so that it fills up the td element? Will it be easier if I use an external library like raphael.js, or is there a different way of embedding?

Upvotes: 1

Views: 1022

Answers (1)

Daniel
Daniel

Reputation: 2014

A quick fast comment from me. Did you forget the equal sign?

width "100%"
max-width "100%"

Maybe try this, it works for me.

<img src="file.svg" style="width:100%;height:100%;" />

Upvotes: 1

Related Questions