我有一个 php Mailer 电子邮件,我在其中设置了 html 电子邮件的样式。除了我在 #email-header
中的内容超出了屏幕宽度之外,一切都是正确的。我不确定为什么,因为我将 max-width
设置为 600px。
有没有人看到我做错了什么会导致这种情况?
$mail2->Body = '
<body>
<div id="header-background" style="background:#16597B;width:100%;max-width:100%;height:auto;">
<div id="email-header" style="width:600px;max-width:600px;height:auto;margin:auto;display:block;padding:20px 8px;">
<div id="logo"><a href=""><img src="" style="width:200px;height:auto;text-align:center" alt=""></a></div>
<div style="clear:both;"></div>
<div id="email-to" style="color:#FFF;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:bold;font-size: 2em;margin-top:35px;">Hi '.$consult_name.',</div>
<div id="email-header-description" style="font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-size:1.3em;color:#d0dde4;margin-top:45px;">
<p style="font-size:1.3em;">Thanks for wanting to work with us!</p>
<p>We received your consultation inquiry. Here shortly your information will be reviewed and we will be in touch with you as soon as possible to schedule your consultation.</p><br>
<p>Thanks again!</p><br>
</div>
</div>
</div>
</div>
</body>
';
最佳答案
问题是你有一个固定宽度 600px
除了你的 max-width
600 像素。只需删除固定的 width
应该可以解决您的自动换行问题。
请注意,600px 对于手机来说是一个相当高的断点,因为许多手机都有一个 display below this .我推荐 300px
覆盖大多数设备。
另请注意,您还有一个额外的关闭 </div>
,这可能会导致一些客户端发挥作用。
这是修复这两个问题的更新代码:
$mail2->Body = '
<body>
<div id="header-background" style="background:#16597B;width:100%;max-width:100%;height:auto;">
<div id="email-header" style="max-width:600px;height:auto;margin:auto;display:block;padding:20px 8px;">
<div id="logo">
<a href=""><img src="http://placehold.it/100" style="width:200px;height:auto;text-align:center" alt=""></a>
</div>
<div style="clear:both;"></div>
<div id="email-to" style="color:#FFF;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-weight:bold;font-size: 2em;margin-top:35px;">Hi '.$consult_name.',</div>
<div id="email-header-description" style="font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-size:1.3em;color:#d0dde4;margin-top:45px;">
<p style="font-size:1.3em;">Thanks for wanting to work with us!</p>
<p>We received your consultation inquiry. Here shortly your information will be reviewed and we will be in touch with you as soon as possible to schedule your consultation.</p>
<br>
<p>Thanks again!</p>
<br>
</div>
</div>
</div>
</body>
';
希望对您有所帮助! :)
关于php - 电子邮件内容超出屏幕宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44511902/