Frage HTML in Outlook 2010/2016

[klopfer619]

Hallo zusammen,

ich erstelle momentan E-Mail-Meldungen, die automatisch von einer Website gesendet werden sollen. Wie ich verbittert feststellen muss, ist Outlook alles andere als kooperativ...
Mein Problem ist, dass ich den Style eines Paragraphen/Span nicht so hinbekomme, dass Outlook ihn so darstellt, wie ich es will.
Ich hätte gern, dass der Paragraph sich an die Länge der Short-Description (siehe Code) anpasst und zusätzlich, dass der Paragraph komplett in grau getönt ist. Er stellt sich jetzt aber nur mit einem doppelten Rahmen dar und nur der Hintergrund vom Text ist wie ein Textmarker in grau gefärbt. Siehe Anhang
Der Code ist folgender:
<p>
<span style="background-color: #666666; color: #cccccc; font-family: 'news gothic', regular, bold; font-size: 20px; letter-spacing: 2px; padding: 20px; border: 4px double #cccccc; text-align: left; width: auto;">
${number}: ${short_description}
</span>
</p>
Ich arbeite noch nicht lange mit HTML. Das Problem hier ist auch, dass in meinem Editor nur Inline-CSS Elemente verwendet werden können.

Habt ihr einen Tipp für mich? In der Suche bin ich nicht schlau geworden...
Vielen Dank :)
Beste Grüße
klopfer619

 

[SpiceLab]

Dem Inline-Element <span> fehlt die sog. Block-Level-Charakteristika, um das Elternelement <p> (=Block-Element) vollflächig auszufüllen.

Dies wird mit display:block erzielt:

<p>
  <span style="display:block; /* hier folgt das übrige CSS */">${number}: ${short_description}</span>
</p>

Ansonsten gibt es eine aufschlußreiche Tabelle, in welchem Umfang CSS von den diversen gängigen Email-Clients überhaupt unterstützt wird:

• https://www.campaignmonitor.com/css/

Die Schere könnte stellenweise nicht größer sein, und ist der Grund für die vielen Forenthemen rund um HTML-Mails.