Search code examples
htmlbuttonhtml-email

Check the code below to help me centre my gmail button


I'm very very new to html. I'm mostly copy-pasting bits of code as my framework and customizing it to make my emails work. I have this bit of code for my email, but I can't seem to get the opt-in button to center. I've tried reading other similar questions, but my knowledge of coding is that of a beginner, and I can't understand how their coding solutions, in which the code is slightly different, relates to my code to find a solution. I was adding style=text-align: center; in a few spots, but it wasn't working. There were other solutions, but I didn't quite understand how they would work in my code. I've been trying to fix this things for hours now. So very frustrated.

Other than the centering it works in the email.

<td valign="middle" style="text-align: center; padding: 0px 10px 10px 
0px;">You've previously contacted us at Business Name.&nbsp;<br>We 
are <b>only sending this email once</b> to our current client list to 
invite you to join our new free monthly e-newsletter.&nbsp;<br>

 style="text-align: center;
<table width="100%" cellspacing="0" cellpadding="0"><tbody><tr>
  <td>
      <table cellspacing="0" cellpadding="0">
          <tbody><tr>
              <td style="border-radius: 2px;" bgcolor="#018736">
                  <a href="https://www.businessname.com/community- 
 newsletter.html" target="_blank" style="padding: 10px 32px; border: 1px 
 solid #018736;border-radius: 2px;font-family: Helvetica, Arial, sans- 
serif;font-size: 24px; color: #ffffff;text-decoration: none;font- 
 weight:bold;display: inline-block;">
                      OPT-IN             
                  </a>
              </td>
          </tr>
      </tbody></table>
  </td>
 </tr>
</tbody></table>


<br>Grief is a difficult thing. If you choose not to join our free 
monthly newsletter at this time we understand, but will not be sending 
any other emails to you going forward. <br><br></td>

Solution

  • Use this code below:

     <td valign="middle" style="text-align: center; padding: 0px 10px 10px 
        0px;">You've previously contacted us at Handsome Stitchery.&nbsp;<br>We 
        are <b>only sending this email once</b> to our current client list to 
        invite you to join our new free monthly e-newsletter.&nbsp;<br>
        <table width="100%" cellspacing="0" cellpadding="0"><tbody><tr>
          <td style="text-align:center;">
              <table cellspacing="0" cellpadding="0" style="margin:0 auto;">
                  <tbody><tr>
                      <td style="border-radius: 2px;" bgcolor="#018736">
                          <a href="https://www.handsomestitchery.com/community- 
         newsletter.html" target="_blank" style="padding: 10px 32px; border: 1px 
         solid #018736;border-radius: 2px;font-family: Helvetica, Arial, sans- 
        serif;font-size: 24px; color: #ffffff;text-decoration: none;font- 
         weight:bold;display: inline-block;">
                              OPT-IN             
                          </a>
                      </td>
                  </tr>
              </tbody></table>
          </td>
         </tr>
        </tbody></table>
    
    
        <br>Grief is a difficult thing. If you choose not to join our free 
        monthly newsletter at this time we understand, but will not be sending 
        any other emails to you going forward. <br><br></td>