PHPmailer - CSS does not appear

Question

PHPmailer - CSS does not appear

Navigation

#1 by (3 votes)
#2 by (1 votes)

5

Hello, I'm trying to set up phpmailer to send a message in html with css, but it's not recognizing the css.

What's wrong?

$mail->Body = '
        <style type="text/css">
            .corpo {margin: 15px;padding: 15px;background-color: #FFF;}
            .body {background-color: #E1E1E1;font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;font-size: 16px;}
        </style>

        <div class="body">
            <div class="corpo">
                <p><img src="http://...../images/logoEmpresa.png"width="90" height="50"></p>
                <p>O conteúdo da nova tag div é inserido aqui</p>
            </div>
        </div>

';

php html5 css phpmailer

asked by anonymous 25.06.2015 / 21:27

2 answers

1

Just like @Fernando said

I will leave my solution collaboratively if others have the same doubt:

<body style="margin:0px;">
<table width="100%" border="0" cellspacing="0" cellpadding="50" style="background-color:#BCBCBC; margin:0px;"><tbody><tr><td height="331" valign="top">

    <table width="90%" border="0" align="center" cellpadding="50" style="background-color:#FFFFFF;"><tbody><tr><td>
          Aqui vai seu texto
    </td></tr></tbody></table>

</td></tr></tbody></table>

Final result:

Now just work on your message according to your need.

25.06.2015 / 23:48

jQuery - Use two functions together In R, using the plotly package, can I plot the map of Brazil and its states?

score 3 · Accepted Answer

Well, your problem is not related to any problem with PHP or PHPmailer, but style CSS does not work for all email providers.

In your case the destination is gmail and it removes all <head> , <style> of your email.

So the only solution for creating CSS-style e-mail that works in the vast majority of e-mail providers is going to CSS inline , there are even a few tools for this CSS inline CSS), such as CSS Inliner Tool , Inliner , Inline styler .

Source in addition to CSS inline , other techniques so that your email is interpreted appropriately by most providers. How:

Keep your code simple: HTML coding for e-mail differs from website encoding. The simpler the code, the less space for errors.
Use CSS only for general style elements: You'll get the best results if you use CSS for general elements like fonts or colors.
Use CSS inline: Browser-based email applications such as Gmail strip the <head> and <body> tags by default.

Another tip, which is not in the source quoted, create the layout of your email within tables ( <table> ), save tables, create tables inside table cells, forget Tableless when creating emails. Some providers (Outlook Desktop and Outlook webmail) love not to respect the styles of their beautiful layout with divs. (I recently had to refactor a full layout for =( tables.)