Html электронная почта <hr/"> проблема стиля
У меня проблема с почтовыми клиентами, которые возвращают мой стилизованный <hr/>
к одному с сплошной линией.
Ниже приведена моя надбавка, отлично смотрится в Chrome и IE, но Outlook всегда возвращает точную строку в сплошную.
<hr style="background:none; border:dotted 1px #999999; border-width:1px 0 0 0; height:0; width:100%; margin:0px 0px 0px 0px; padding-top:10px;padding-bottom:10px;" ></hr>
Я посмотрел на Монитор Кампании, но ничего особенного, чтобы вести меня там.
Все ответы оценены.
Ответы
Ответ 1
Я бы это себе представлял, потому что Outlook использует механизм рендеринга слов Microsoft, а не механизм HTML, а тэг hr просто вернется к сплошной строке, как в msword.
Я бы, вероятно, попытался использовать таблицу ширины width = > cell или div и style, вместо использования тега hr.
<table>
<tr>
<td style="background:none; border:dotted 1px #999999; border-width:1px 0 0 0; height:1px; width:100%; margin:0px 0px 0px 0px; padding-top:10px;padding-bottom:10px;"> </td>
</tr>
</table>
nbsp находится там, где механизм рендеринга не распознает пустые ячейки.
Ответ 2
Основываясь на других ответах, я нашел, что это лучше всего работает:
<table border="0" width="100%" cellpadding="0" cellspacing="0">
<tr>
<td style="background:none; border-bottom: 1px solid #d7dfe3; height:1px; width:100%; margin:0px 0px 0px 0px;"> </td>
</tr>
</table>
<br>
Ответ 3
Вы можете использовать этот пример:
<div style="border-top: 1px dotted #999999;"> </div>
Он будет работать только на белом фоне, к сожалению
Ответ 4
Скорее неэлегантный и полезный только для известной фиксированной ширины, но я нахожу, что это те ужасы, которые вы посещали, пытаясь исправить форматирование в html-письмах.
<p style="line-height:20%; color:#cccccc; margin:0px 0px 0px 0px; padding:0px 0px 0px 0px;">........................................................................................................................................</p>
Ответ 5
Необходимо объявить размер шрифта, иначе " " беспорядок с высотой.
<tr><td style="background:none; border-bottom: 4px solid #DC1431; height:1px; width:100%; margin:0px 0px 0px 0px; font-size: 1px"> </td></tr>