SVG : I need an SVG file that reads 'TEST' and auto-expands 100%

Question

This is the file i have.

<svg
   width="700"
   height="500">
  <g
     id="layer1">
    <text
       style="font-size:100%;font-family:Bitstream Vera Sans"
       x="6"
       y="37"
       id="">TEST</text>
  </g>
</svg>

i want TEST to automatically occupy the whole thing somehow. like 100% kind of a thing.

right now the text is miss-alligned due to x and y ordinates.

Answer 1

Try setting the viewBox instead of a specific width and height:

<svg viewBox="0 0 240 70">
  <g id="layer1">
    <text
       style="font-size:100px;font-family:Bitstream Vera Sans"
       x="0"
       y="70"
       id="">TEST</text>
  </g>
</svg>

Note that Chrome has some rendering inconsistencies with SVG with no specific height.