nice site - very helpful!

Hey, Thank you for the tips.

I was trying to load svg file inside a div using bootstrap and embed tag. How can I make the svg file fit the size of the panel no matter the original size of the svg image.

here is my code

<div class="panel-body" id="SVGPanel">

<embed src="C:\Users\User\Documents\test.svg" id="testsvg" name="testsvg" type="image/svg+xml"/>

</div>

And the content of the test.sg

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.2" viewport-fill="#fff">

<defs/>

<image x="0" y="0" width="100%" height="100%" xlink:href="data:image/png;base64,blahblahblahyadayadayada" preserveaspectratio="none"/>

<circle cx="35.6%" cy="18.6%" r="10" stroke-width="6" type="test" framename="framename" fill="#fff" stroke="#000"/><circle cx="63.6%" cy="29.3%" r="0.5%" stroke-width="6" type="test" framename="framename" fill="#fff" stroke="#000"/><circle cx="51.3%" cy="24.5%" r="0.5%" stroke-width="6" type="test" framename="framename" fill="#fff" stroke="#000"/><circle cx="357" cy="69" r="20" stroke-="" width="6" type="test" framename="framename" fill="#fff" stroke="#000"/>

</svg>

But the image is currently stretching to full width of the panel which is full screen but the height is only one third of the width. Please help me to set the height and width of the svg as the height and width of the panel.