Skip to content

Instantly share code, notes, and snippets.

@johndhancock
Created March 19, 2015 21:45
Show Gist options
  • Save johndhancock/42cd4ea85113f0059aa3 to your computer and use it in GitHub Desktop.
Save johndhancock/42cd4ea85113f0059aa3 to your computer and use it in GitHub Desktop.
SVG fix for IE
<div class="svg-container">
<svg version="1.1" class="svg-content" viewBox="0 0 900 487" preserveAspectRatio="xMinYMin meet"> ... </svg>
</div>
In your css...
.svg-container {
position: relative;
width: 90%; /*Whatever you want*/
padding-bottom: 54%; /*Ratio of width/height from svg viewBox setting. eg. 487/900 = .54*/
}
.svg-content {
display: inline-block;
position: absolute;
top: 0;
left: 0;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment