Eloqua добавляет дополнительные периоды к моей электронной почте CSS

Question

Я работаю в системе автоматизации маркетинга (Eloqua) для развертывания электронных писем в формате HTML и целевых страниц. В последнее время они запустили некоторые обновления в своей системе, и она начала непоследовательно заполнять дополнительный период перед одним или двумя моими объявлениями классов из встроенной таблицы стилей. Например, мой размещенный код для электронных писем в формате HTML имеет встроенную таблицу стилей в верхней части для отображения отзывчивых электронных писем. В этой таблице стилей у меня есть определенные объявления класса. Когда они развертываются, я наблюдаю непоследовательную ошибку, когда система добавляет дополнительный период перед одним или двумя объявлениями класса (например, из.removePad в..removePad), что, очевидно, делает объявление класса неработающим. Этот дополнительный период одинаков для всех платформ / браузеров. Он также вставляет разрыв строки непосредственно перед дополнительным периодом, но поскольку пробел не имеет значения в HTML, это не что иное, как дополнительная подсказка в сценарии.

Я провел обширное тестирование и провел дни с их командой поддержки. Их последнее предложение помощи мне состояло в том, чтобы сказать мне, что мой HTML был неверным, и поэтому добавляется дополнительный период. Вот некоторые фрагменты того, что они говорят мне неправильно написанный код. Он вращается вокруг установки отступов и полей на 0. У меня всегда было впечатление, что при установке полей и отступов на 0 единица измерения не требуется (например, поле: 0 авто; заполнение: 0; поле: 0; в отличие от на полях: 0px auto; ... и т. д.).

Сказанные фрагменты кода:

body {width: 100%; background-color: #ffffff; margin:0; padding:0;}
.removePad {padding-right:0!important;padding-left:0!important;}
.resetType {font-size: 13px!important; line-height: normal!important; margin-top: 0;}

1: Я ошибаюсь в этом предположении о том, что мне не нужна единица измерения при установке на 0?

2: Кто-нибудь когда-либо был свидетелем чего-то подобного, вставляя разрыв строки / дополнительный период?

3: я не знаю много о том, на каком языке кодирования будет написана их программа, и при этом я не знаю сложных языков кодирования, но кто-нибудь знает сценарий на языке кодирования, который сделал бы этот сценарий возможным?

Если бы это был вопрос простого входа и установки единицы измерения в каждом из моих атрибутов, я бы сделал это и сказал бы, хорошего дня. Тем не менее, теперь я был свидетелем и инцидентом, который произошел после того, как я это сделал, поэтому я в замешательстве, ошеломлен и заброшен. Возможно, кто-то здесь мог бы предложить мне немного понимания или указания для устранения неполадок.

Большое спасибо за любые мысли!

ОБНОВЛЕНИЕ: весь CSS

<style type="text/css">
    .ReadMsgBody {width: 100%; background-color: #ffffff;}
    .ExternalClass {width: 100%; background-color: #ffffff;}
    .ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {line-height: 100%;}
    body {width: 100%; background-color: #ffffff; margin:0; padding:0; -webkit-font-smoothing: antialiased;}
    table {border-collapse:collapse;}
    a:visited {color:#0085c3;}
    @media only screen and (max-width: 640px)  {
        body[yahoo] .deviceWidth {width: 440px!important;}
        body[yahoo] .tableWidth {width: 410px!important;}
        body[yahoo] .hide {display: none!important;}
        body[yahoo] .show {display: block!important; padding:0; width: auto !important; overflow: visible !important; max-height: inherit !important;}
        body[yahoo] .borderRadius {border-radius: 10px;}
        body[yahoo] .center {margin:0 auto;}
        body[yahoo] .headline {font-size: 22px!important; color: #ffffff!important; background-color: #0085c3!important; border-top-left-radius: 5px; border-top-right-radius: 5px; padding-top: 15px!important; padding-left:15px!important; padding-right:15px!important;}
        body[yahoo] .blueDivide {border-top: 2px solid #0085c3;}
        body[yahoo] .borderGone {border-top: none; border-right:none !important; border-bottom: none; border-left:none !important;}
        body[yahoo] .logo {height:60px; width:141px; padding-left: 15px;}
        body[yahoo] .removePad {padding-right:0!important;padding-left:0!important;}
        body[yahoo] .ctaButton {padding: 5px 10px; background-color: #0085ce !important; color: #ffffff !important; text-decoration: none !important; border-radius: 5px; width: 180px ; text-align: center !important; margin-top: 10px; display: block !important; margin: 0 auto;}
        body[yahoo] .ctaButton2 {padding: 5px 10px; background-color: #0085ce !important; color: #ffffff !important; text-decoration: none !important; border-radius: 5px; width: 340px ; text-align: center !important; margin: 0 auto !important; display: block !important;}
        body[yahoo] .resetType {font-size: 13px!important; line-height: normal!important; margin-top: 0}
        body[yahoo] .topBox {border-top-left-radius: 10px; border-top-right-radius: 10px;}
        body[yahoo] .bottomBox {border-bottom-left-radius: 10px!important; border-bottom-right-radius: 10px!important; border-bottom:#0085c3 solid 1px; border-right:#0085c3 solid 1px; border-left:#0085c3 solid 1px; padding-top: 15px; padding-left: 14px; padding-right: 14px;}
        body[yahoo] .imagePad {padding-top: 5px; padding-bottom: 5px; padding-left: 14px; padding-right: 10px;}
        body[yahoo] .rightPad {padding-right: 14px;}
        body[yahoo] .salesBox {border-radius:5px; padding: 10px 0; margin-top:15px; background-color: #eeeeee;}
    }
    @media only screen and (max-width: 479px) {
        body[yahoo] .deviceWidth {width:300px!important}
        body[yahoo] .tableWidth {width:270px!important}
        body[yahoo] .headline {font-size: 20px!important;}
        body[yahoo] .ctaButton2 {padding: 5px 10px; background-color: #0085ce !important; color: #ffffff !important; text-decoration: none !important; border-radius: 5px; width: 180px ; text-align: center !important; margin: 0 auto !important; display: block !important;}
        body[yahoo] .logo {height:50px; width:118px; padding-left: 10px;}
    }
</style>

Answer 1

1. Вы должны указать единицы измерения для полей и отступов, или любой другой размерный атрибут. Вы можете использовать px, em, % или pt. Тогда, по крайней мере, вы можете быть уверены, что это не проблема.

2. Я не уверен, какую систему вы используете, которая генерирует электронную почту и веб-страницы. Возможно, вы могли бы предоставить больше информации, но если после указания юнитов у вас все еще есть проблема, я бы предположил, что она заканчивается.

Генераторы кода из вашего шаблона кода могут быть хитрыми. Старайтесь соответствовать наиболее распространенному стилю, чтобы уменьшить вероятность того, что их генератор захлебнется вашим кодом.

Answer 2

Исходя из вашего нового кода, в нижней части отсутствует пара точек с запятой. Электронная почта может быть темпераментной, поэтому исправьте это и проверьте снова. Я сомневаюсь, что это будет иметь значение, хотя.

Это действительно похоже на ошибку с их программным обеспечением. Надеюсь, это не значит, что вы не можете определить способ танцевать вокруг проблемы.

Какие классы получили двойные точки? Это всегда одни и те же или случайные?