title: Text over image without absolute position
body: <p>I am trying to put some text over an image in the middle of a page.</p>
  
  <p>I saw an example like this:</p>
  
  <pre><code>&lt;img src="image.png" style="z-index: -1;" /&gt;
  &lt;p style="position: absolute; top: 1px; left: 1px;&gt;text&lt;/p&gt;
  </code></pre>
  
  <p>but when i try to center it the text will not be in the center.</p>
  
  <pre><code>&lt;div&gt;
      &lt;center&gt;
           &lt;img src="image.png" style="z-index: -1;" /&gt;
           &lt;p style="position: absolute; top: 1px; left: 1px;&gt;text&lt;/p&gt;
      &lt;/center&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>How can i create a text over image without absolute possition?</p>