How do I <embed> svg and scale it as img

Question

I just like the images that I want to share in the image from the page. I can take a 1024x768 image and do it

<img src="1024x768.jpg" width="400" height="300"/> 

or i can do it

 <img src="1024x768.jpg" style="width:400px; height:300px"/> 

and the image will be scaled without cropping. How can I do the same with svg? Note. I do not want to embed svg directly in the page. That would be as stupid as using dataURL for all my images. My artists are editing images, other people are editing html, so I need them to be separate.

 <embed src="somefile.svg" width="400" height="300"></embed> 

Does not scale svg, it just grows. CSS width / height does not work. Is this a way to make it look like images?

Answer 1

okay apparently you can just use svg in the img tag

 <img src="somefile.svg" width="200"/> 

And it works in IE9 +, FF4 +, Chrome4 +, Safari4 +, Opera 9.

Answer 2

I had the same problem - in IE, not in Chrome. I found that scaling (instead of cropping) will occur if the svg file internally has the viewBox attribute in the svg tag.