user3698196 user3698196 - 4 months ago 17
jQuery Question

How to resize a svg to fit inside a div?

on trying fitting in to div(with border) svg is cut off from the right size.

PEN

HTML

<div style="position:relative;width:550px;height: 500px;background: gainsboro;border: 4px solid;">

<-- My SVG -->

</div>


help me fit this svg in 550x500

Answer

Don't use width or height in your SVG.

Use viewbox instead. Then the SVG will scale automatically (mostly).

<svg xmlns="http://www.w3.org/2000/svg" viewbox ="0 0 959 593">

Codepen Demo

Comments