GMX 应用程序上的 HTML 电子邮件已推迟

Question

我有一个非常特殊的问题。目前我想将我的电子邮件重新创建为漂亮的 HTML/CSS 格式。我的第一个电子邮件布局已经完成，但存在电子邮件无法在 iOS 上的 GMX 应用程序中正确显示的问题(安卓尚未测试)。在屏幕截图中，您可以更清楚地看到差异。

<style style="margin: 0;padding: 0;" type="text/css">*{
                margin: 0;
                padding: 0;
            }
        
            body {
                display: block;
                background: #e8e8e8;
                font-family: "Arial";
                color: #2f3000;
                font-size: 120%;
                
            }

            .mail-container {
                display: block;
                margin: 0 auto;
                max-width: 600px;
            }
            
            .headbox {
                display: block;
                background: #2f3032;
                
            }
            
            .headbox img {
                display: block;
                margin: 0 auto;
                
            }
            
            .mainbox {
                display: block;
                margin-top: 10px;
                background: white;
                padding-bottom: 10px;
            }
            
            .mainbox h1 {
                display: block;
                padding-top: 10px;
                text-align: center;
                margin: 0 auto;
                font-weight: 100px;
                font-size: 180%;
                padding-top: 30px;
            }
            
            .mainbox h2 {
                display: block;
                text-align: center;
            }
            
            .mainbox p {
                display: block;
                padding-top: 20px;
                text-align: center;
                margin: 0 auto;
                max-width: 95%;
                text-decoration: none;
            }
            
            .mainbox img {
                display: block;
                padding: 10px;
                margin: 20px auto;
                max-width: 95%;
            }
            
            .mainbox .gruß {
                display: block;
                text-align: center;
                margin: 0 auto;
            }
            
            .mainbox .button {
                display: block;
                width: 230px;
                margin: 0 auto;
                color: white;
                background-color: #f95f00;
                border-radius: 5px;
                padding: 15px;
                margin-top: 30px;
                padding-top: 16px;
                margin-bottom: 40px;
            }
        
            .mainbox .button:hover {
                opacity: 0.8;
            }
</style>
<div class="mail-container" style="margin: 0 auto;padding: 0;display: block;max-width: 600px;">
<div class="headbox" style="margin: 0;padding: 0;display: block;background: #2f3032;"><img src="http://lifestyle-gesundheit.com/wp-content/uploads/2017/02/Head-weiß.png" style="margin: 0 auto;padding: 0;display: block;" /></div>

<div class="mainbox" style="margin: 0;padding: 0;display: block;margin-top: 10px;background: white;padding-bottom: 10px;">
<h1 style="margin: 0 auto;padding: 0;display: block;padding-top: 30px;text-align: center;font-weight: 100px;font-size: 180%;">HERVORRAGEND!</h1>
<img src="http://lifestyle-gesundheit.com/wp-content/uploads/2017/03/Headbild-E-Mail.jpg" style="margin: 20px auto;padding: 10px;display: block;max-width: 95%;" />
<h2 style="margin: 0;padding: 0;display: block;text-align: center;">Du kannst nun dein kostenloses E-Book downloaden!</h2>

<p style="margin: 0 auto;padding: 0;display: block;padding-top: 20px;text-align: center;max-width: 95%;text-decoration: none;">In den n&auml;chsten 3 Tage erh&auml;ltst du jeweils eine E-Mail zu den drei S&auml;ulen des Lebens. In diesen E-Mails zeigen wir dir, wie du dein Leben umkrempelst und erfolgreich wirst. Sprich: wie du der K&uuml;nstler deines Lebens wirst.<br style="margin: 0;padding: 0;" />
All diese Informationen sind f&uuml;r dich kostenfrei zug&auml;nglich!</p>

<p class="gruß" style="margin: 0 auto;padding: 0;display: block;padding-top: 20px;text-align: center;max-width: 95%;text-decoration: none;">Wir w&uuml;nschen dir viel Spa&szlig; und Erfolg mit deinem E-Book.<br style="margin: 0;padding: 0;" />
Lebe mit uns den gesunden Lifestyle</p>

<p class="button" style="margin: 0 auto;padding: 15px;display: block;padding-top: 16px;text-align: center;max-width: 95%;text-decoration: none;width: 230px;color: white;background-color: #f95f00;border-radius: 5px;margin-top: 30px;margin-bottom: 40px;"><a href="http://lifestyle-gesundheit.com/wp-content/uploads/2017/02/Ebook-Lifestyle-Gesundheit.pdf" style="text-decoration: none;margin: 0;padding: 0;"><span style="color: #FFFFFF;margin: 0;padding: 0;">JETZT DOWNLOADEN</span></a></p>
</div>
</div>

Answer 1

你可以关闭这个线程，我可以自己解决这个问题。在我使用的电子邮件系统 (klick-tipp.com) 中，我忘记更改签名的宽度。