how to make <svg> 100% width

Question

I am trying to make this <svg> element stretch to 100% of the screen width:

  <svg height="100" width="100">    <path d="M0 0 L100 0 L50 100 Z" />   </svg> 

What do I need to do?

Answer 1

The viewBox defines the co-ordinates you can see. Height and width define the size of the SVG. E.g.

html, body {    width: 100%;    height: 100%;  }

<svg height="100%" width="100%" viewBox="0 0 100 100"  preserveAspectRatio="none">     <path d="M0 0 L100 0 L50 100 Z" />  </svg>