Skip to content
  • home
  • portfolio
  • web design journal
  • blog
    • adventure
    • san diego
    • projects
    • website design
Blog Web Dev Why Isn’t My SVG Image the Right Size in Internet Explorer

Why Isn’t My SVG Image the Right Size in Internet Explorer

By Forrest Smith - Drempd.com

My svg images looked fine in the good browsers, but in Internet Explorer, they were appearing huge!  I attempted to just set the size using css in the image tag, but that didn’t work. 

What actually did work, was I opened up the svg file, and added a “viewBox” value to the svg declaration, so I my file looked something like this:

<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="400"
height="360" 
viewBox="0 0 400 360"
....

So the viewbox numbers, I just set this to start at the top left (the two 0’s), and then set the other corner of the viewbox with the 400 (the width), and the 360 (the height). This change fixed it.

Posted on October 29, 2015August 26, 2022 in Web Dev
  • Adventure

    • adventure
    • gravelgrinding
    • hiking
    • running
  • The Built Environment

    • architecture
    • urbanity
  • Locations

    • san diego
    • portland
  • Freelance Life

    • freelancing
    • productivity
  • Web Dev

    • css
    • entrepreneurship
    • git
    • handlebars
    • html
    • inkscape
    • photoshop
    • php
    • sass
    • web design
    • web development
    • saphire

drempd | san diego, ca


home contact

adventures san diego urbanity and architecture projects stream website design

portfolio resume san diego web design freelance web designer

custom web design responsive web design website maintenance