Microsoft Outlook unter Windows Fügt Padding meiner H4

Question

Werfen Sie einen Blick auf das folgende Bild:

Was Sie sehen, gibt es einen markierten <h4> Element (wenn es eine Verwirrung ist, dass grau kein Hintergrund ist Farbe, es ist mir, den Text hervorhebend). Es hat Inline-Stile, die explizit padding-bottom: 0; und line-height: 18px; deklarieren (das gleiche wie die Schriftgröße - nicht sicher, ob das sogar in Outlook funktioniert, aber dachte, ich würde es versuchen). Darüber hinaus wird der HTML-Code vollständig minimiert (er wird also nicht durch Leerzeichen oder Tabulatorzeichen verursacht), und der Code wurde auf verdeckte Zeilenumbruchzeichen überprüft (es gibt keine).

Nichtsdestoweniger ignoriert Microsoft Outlook (nur unter Windows) mich glücklich und fügt den ganzen zusätzlichen Raum unter dem Element hinzu. Ich habe Ideen, wie ich dieses Problem beheben kann.

Wie kann ich die Höhe dieses Kopfelements festlegen, so dass es nur die Höhe des Textes ist?

Answer 1

Ich finde diese Regeln hilfreich:

#outlook a{ 
     padding:0; 
    } 
    .ReadMsgBody{ 
     width:100%; 
    } 
    body{ 
     width:100% !important; 
     min-width:100%; 
     -webkit-text-size-adjust:100%; 
     -ms-text-size-adjust:100%; 
     -webkit-font-smoothing: antialiased; 
    } 
    v*{ 
     behavior:url(#default#VML); 
     display:inline-block; 
    } 
    .ExternalClass{ 
     width:100%; 
    } 
    td{ 
     border-collapse: separate !important; 
    } 
    .ExternalClass, 
    .ExternalClass p, 
    .ExternalClass span, 
    .ExternalClass font, 
    .ExternalClass td, 
    .ExternalClass div{ 
     line-height:100%; 
    } 

Sie auch eine Regel hinzufügen können die h4 line-height auf 0 setzen:

h4{ 
    margin:0; 
    padding:0; 
    border:0; 
    font-size:100%; 
    line-height:100%; 
} 

Dann fügen Sie zurück in Zeilenhöhe INLINE:

<h4 style: font-size: 24px; color: #000000; line-height: 1.8em;">This is an h4 headline</h4>