title: How to place and center text in an SVG rectangle
body: <p>I have the following rectangle:</p>
  <pre><code>&lt;rect x=&quot;0px&quot; y=&quot;0px&quot; width=&quot;60px&quot; height=&quot;20px&quot;/&gt;
  </code></pre>
  <p>I would like to center the word &quot;Fiction&quot; inside of it. For other rectangles, does SVG word wrap to stay within them? I can't seem to find anything specifically about inserting text within shapes that are centered both horizontally and vertically and word wrap. Also, the text can not leave the rectangle.</p>
  <p>Looking at the <a href="https://www.w3.org/TR/SVG/text.html#TextElement" rel="noreferrer">https://www.w3.org/TR/SVG/text.html#TextElement</a> example doesn't help since the text element's x and y are different from the rectangle's x and y. There doesn't seem to be width and height for text elements. I am not sure of the math here.</p>
  <p>(My HTML table is just not going to work.)</p>