Skip to content

Instantly share code, notes, and snippets.

@AlexBezuska
Created August 24, 2016 21:42
Show Gist options
  • Save AlexBezuska/3fff360713f8e2bc7a4791e7e2a24bfc to your computer and use it in GitHub Desktop.
Save AlexBezuska/3fff360713f8e2bc7a4791e7e2a24bfc to your computer and use it in GitHub Desktop.
responsive vs non svg
responsive:
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 25.51 218.96"><defs><style>.cls-1{fill:#b5b5b6;stroke-width:1.44px;}.cls-1,.cls-3{stroke:#000;stroke-miterlimit:10;}.cls-2{fill:#d33f27;}.cls-3{fill:#d4d4d6;stroke-width:0.72px;}</style></defs><title>barge-radar-responsive</title><path class="cls-1" d="M0.88,206.32s1.49,11.92,13.41,11.92,10.43-13.41,10.43-13.41L24.56,14.13S26.05,0.72,14.13.72,0.72,12.64.72,12.64Z"/><ellipse class="cls-2" cx="5.81" cy="17.59" rx="2.89" ry="8.44"/><ellipse class="cls-2" cx="5.81" cy="200.88" rx="2.89" ry="8.44"/><rect class="cls-3" x="5.11" y="103.18" width="14.9" height="10.34"/></svg>
not responsive:
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" width="0.35in" height="3.04in" viewBox="0 0 25.51 218.96"><defs><style>.cls-1{fill:#b5b5b6;stroke-width:1.44px;}.cls-1,.cls-3{stroke:#000;stroke-miterlimit:10;}.cls-2{fill:#d33f27;}.cls-3{fill:#d4d4d6;stroke-width:0.72px;}</style></defs><title>barge-radar</title><path class="cls-1" d="M0.88,206.32s1.49,11.92,13.41,11.92,10.43-13.41,10.43-13.41L24.56,14.13S26.05,0.72,14.13.72,0.72,12.64.72,12.64Z"/><ellipse class="cls-2" cx="5.81" cy="17.59" rx="2.89" ry="8.44"/><ellipse class="cls-2" cx="5.81" cy="200.88" rx="2.89" ry="8.44"/><rect class="cls-3" x="5.11" y="103.18" width="14.9" height="10.34"/></svg>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment