Удаление пробела в 1 пиксель в Outlook 2013-2016

Я пытаюсь избавиться от пробела в 1 пиксель справа от графика vml, который появляется в Outlook 2010, 2013, 2016.

Я понимаю, что Outlook автоматически добавляет <p></p> в конец xml, поэтому я обнулил размер шрифта и высоту строки, что устраняет пробел внизу. Любые предложения о том, что еще может быть автоматически добавлено, что может добавить пространство?

<xml:namespace ns="urn:schemas-microsoft-com:vml" prefix="v"/>
  <v:polyline style="width: 500px; 24px; display: inline-block; padding-right: 0pt; border: 0pt !important;" fillcolor="#563d82" strokecolor="#563d82" strokeweight="0pt" stroke="false" coordorigin="0 0" coordsize="24 500" v:borderrightcolor="#ff0000" points="0pt,24pt, 500pt,24pt, 500pt,0pt, 0pt,24pt">
  </v:polyline>
</xml>

Полный html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width"/>
</head>
<body>
<table width="100%" cellpadding="0" cellspacing="0" border="0" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; padding: 0px !important; margin: 0;">
  <tr>
    <td align="right" style="border-collapse: collapse; mso-table-lspace: 0; mso-table-rspace: 0;">
      <table cellpadding="0" cellspacing="0" border="0" align="right" width="498" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; padding: 0pt !important; margin: 0pt; overflow: hidden; display: inline-block;">
        <tr align="right">
          <td align="right" style="border-collapse: collapse; mso-table-lspace: 0; mso-table-rspace: 0; mso-margin-top-alt: 0pt; mso-margin-bottom-alt: 0px; padding: 0px !important; margin: 0; font-size: 0; line-height: 0; display: inline-block;">
            <xml:namespace ns="urn:schemas-microsoft-com:vml" prefix="v"/>
            <v:polyline style="width: 500px; 24px; display: inline-block; padding-right: 0pt; border: 0pt !important;" fillcolor="#563d82" strokecolor="#563d82" strokeweight="0pt" stroke="false" coordorigin="0 0" coordsize="24 500" v:borderrightcolor="#ff0000" points="0pt,24pt, 500pt,24pt, 500pt,0pt, 0pt,24pt">
            </v:polyline>
            </xml>
          </td>
        </tr>
      </table>
    </td>
  </tr>
</table>
<table bgcolor="#563d82" width="100%" cellpadding="0" cellspacing="0" border="0" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; padding: 0px !important; margin: 0;">
  <tr>
    <td align="center">
      <p class="footerlink" style="padding: 0px; color: #ffffff; font-size: 18px; line-height: 22px; text-align: left;">Placeholder text.</p>
    </td>
  </tr>
</table>
</body>
</html>

Я должен добавить, что этот html виден только в Outlook. У меня есть графика css, которая охватывает все остальные браузеры. Жаль, что это не работает с Outlook.


outlook html-email vml
person gwally    schedule 23.09.2016    source источник
comment
Outlook использует слово для своего механизма рендеринга html, а рендеринг html в word настолько плох, что вам лучше использовать ультрасовременный браузер telnet для порта 80 для рендеринга сайтов.   -  person Marc B    schedule 23.09.2016

Ответы (1)


arrow_upward
0
arrow_downward

Замена двух таблиц для выравнивания по правому краю устраняет зазор в 1 пиксель справа.

<div align="right" style="font-size: 0; line-height: 0;">
  <xml:namespace ns="urn:schemas-microsoft-com:vml" prefix="v"/>
    <v:polyline fillcolor="#563d82" strokeweight="0pt" stroke="false" strokecolor="#563d82" style="font-size: 0; line-height: 0;" points="0pt,25pt 500pt,25pt 500pt,0pt 0pt,25pt"></v:polyline>
  </xml>
</div>

Это устраняет проблему выравнивания для Outlook 2016 и Почты Windows 10, но оставляет тонкую белую линию между графикой vml и таблицей для Outlook 2010 и 2013. Я пытался добавить CSS и границы таблицы, но это не решает проблему. .

person gwally    schedule 24.09.2016
comment
Поскольку этот ответ не полностью отвечает на ваш первоначальный вопрос, могу ли я предложить вам обновить свой вопрос с учетом этого прогресса и удалить этот ответ? - person Ted Goas; 26.09.2016