Search code examples
htmlcsswordpresshtml-email

What am I missing to center this div for an email template

It's an email template, so I think I should avoid flex. Any idea why this isn't centered?

<div style="display:inline-block; margin: 0 auto;">
  <div style="background-color: #0097e6; border-radius:30px; font-size: 14px; font-weight: 400; padding: 8px 24px 8px 24px; text-align: center; margin: 24px 10px 5px 10px ;">
    <a href="https://example.com/" style="text-decoration:none; color:#ffffff;">See related</a>
  </div>
</div>

JSfiddle

Solution

  • Not sure if it's an option for you but changing

    display: inline-block;

    to

    display: table;

    would align the button in the center of the container.