title: Overlay Div on image
body: <p>So I have a <code>&lt;div&gt;</code> with relative positioning, and it has a child <code>&lt;img&gt;</code> with absolute positioning.</p>
  
  <pre><code>&lt;div style="position: relative;"&gt;
    &lt;img src="image.png" style="position: absolute;" /&gt;
    &lt;span id="overlay_text"&gt;OVERLAY&lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The problem is that it needs to be at the top (higher on the Y axis, or closer to the top of the screen), but it is only measured in distance from the bottom.</p>