Почему текст не центрируется при отправке по почте?

Question

У меня нормальный HTML-код.

<span style="bottom: 65px;
    position: relative;
    left: 100px; color: red;">Hiii</span>
    <img   src="https://vignette.wikia.nocookie.net/sqmegapolis/images/2/2d/RealWorld_Stonehenge.jpg/revision/latest?cb=20150616102050">

Когда я запускаю этот код, текст центрируется.

Но когда я отправляю этот код в gmail, внешний вид меняется. В gmail выглядит как

Здесь текст не центрирован, и когда я его проверил, я также обнаружил, что все css не передаются в gmail.

Этот CSS не пройден:

bottom: 65px;
position: relative;
left: 100px;

Мне нужно, чтобы текст всегда центрировался при отправке этого html-тела в gmail / mail.

Answer 1

Рекомендую использовать Таблицы для электронной почты. Но как быстрое решение для вас, div сделает это.

<div style="width:600px;">
<div style="text-align: center; color: #ff0000;">
  Hello World. I'm in the center :)
</div>
<img src="https://vignette.wikia.nocookie.net/sqmegapolis/images/2/2d/RealWorld_Stonehenge.jpg/revision/latest?cb=20150616102050" style="width: 100%;">
</div>

С таблицами (все по центру):

<table align="center" border="0" cellpadding="0" cellspacing="0" width="600">
    <tr>
        <td align="center">
            Hello World. I&#39;m in the center :)
        </td>
    </tr>
    <tr>
        <td align="center">
            <img src="https://vignette.wikia.nocookie.net/sqmegapolis/images/2/2d/RealWorld_Stonehenge.jpg/revision/latest?cb=20150616102050" style="width: 100%">
        </td>
    </tr>
</table>