title: How would I put text over an image in HTML email code?
body: <p>I've tried everything under the sun to make some text appear on the image with my current HTML code but to no avail.  </p>
  
  <p>No matter what I do, the text always appears on the bottom of the entire page and never on the image.</p>
  
  <p>I've looked at so many posts on SO but they just don't work for me.</p>
  
  <p>Below is one of my many attempts in terms of fixing this issue and moving on.</p>
  
  <p>What am I doing wrong and how can I fix it? </p>
  
  <p>Here's my HTML code:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code> &lt;body width="100%" bgcolor="#f4f8f1"&gt;
      &lt;table border="0" width="100%" cellspacing="0" cellpadding="0"&gt;
          &lt;tbody&gt;
          &lt;tr&gt;
              &lt;td align="center"&gt;
                  &lt;table border="0" cellspacing="0" cellpadding="0"&gt;
                      &lt;tbody&gt;
                      &lt;tr&gt;
                          &lt;td class="width-320" style="margin: 0 auto;" width="600"&gt;
                              &lt;table border="0" cellspacing="0" cellpadding="0"&gt;
                                  &lt;tbody&gt;
                                  &lt;tr&gt;
                                      &lt;td class="width-320 header-welcome" width="600"&gt;
                                          &lt;a href="#"&gt;
                                              &lt;img class="hide" style="display: block;" src="https://upload.wikimedia.org/wikipedia/commons/thumb/f/ff/Solid_blue.svg/225px-Solid_blue.svg.png" alt="some text" width="1200" height="1000" border="0" /&gt;
                                              &lt;p&gt;This is always appearing on the bottom of the page!&lt;/p&gt;
                                          &lt;/a&gt;
                                      &lt;/td&gt;
                                  &lt;/tr&gt;
                                  &lt;/tbody&gt;
                              &lt;/table&gt;
                          &lt;/td&gt;
                      &lt;/tr&gt;
                  &lt;/tbody&gt;
              &lt;/table&gt;
          &lt;/td&gt;
      &lt;/tr&gt;
      &lt;/tbody&gt;
      &lt;/table&gt;
      &lt;/body&gt;</code></pre>
  </div>
  </div>
  </p>