Sometimes, we want to make the svg element expand or contract to its parent container with HTML.
In this article, we’ll look at how to make the svg element expand or contract to its parent container with HTML.
How to make the svg element expand or contract to its parent container with HTML?
To make the svg element expand or contract to its parent container with HTML, we remove the width and height attributes.
For instance, we write
<svg viewBox="0 0 3212 3212" fill="none" xmlns="http://www.w3.org/2000/svg">
circle cx="1606" cy="1606" r="1387" stroke="black" stroke-width="438"/>
</svg>
to remove the width and height attributes from the svg element to make it fit its parent container.
Conclusion
To make the svg element expand or contract to its parent container with HTML, we remove the width and height attributes.
