0

i tried sending an email dynamically using PHP Mail sending function and for some reasons my email is not displaying colors.

$to = $fetch_querygetemail['email'];
$subject = "report";
//$message = $_POST['allreportcont'];
$message = @"
<table style='width:700px; background-color:#F9F9F9; padding:20px;'>
<tbody><tr>
<td colspan='2'><span style='color:#f68e36; font-weight:bold !important;'>Coupons Sales</span> <span style='color:#333;'>(From: 2014-08-12 | To: 2014-08-29)</span><br>
<hr></td></tr>
<tr>
<td style='color:#333; padding-left:45px; width:300px;'>Coupons Offered</td>
<td>831</td>
</tr>
<tr>
<td style='color:#333; padding-left:45px;'>Coupons Left</td>
<td>715</td>
</tr>
<tr>
<td style='color:#333; padding-left:45px;'>Total Sold</td>
<td>193</td>
</tr>
<tr>
<td style='color:#333; padding-left:45px;'>Sold &amp; Redeemed</td>
<td>18</td>
</tr>
<tr>
<td style='color:#333; padding-left:45px;'>Sold &amp; Unredeemed (Expired)</td>
<td>175</td>
</tr>
<tr>
<td colspan='2'>&amp;nbsp;</td>
</tr>
<tr>
<td colspan='2'><span style='color:#f68e36; font-weight:bold !important;'>Amount Sales</span><br>
<hr></td>
</tr>
<tr>
<td style='color:#333; padding-left:45px;'>Gross Sales</td>
<td>$2100</td>
</tr>
<tr>
<td style='color:#333; padding-left:45px;'>Discount Offered</td>
<td>$70</td>
</tr>
</tbody></table>
";
$headers = "MIME-Version: 1.0" . "\r\n";
$headers .= "Content-type:text/html;charset=UTF-8" . "\r\n";
$headers .= 'From: Sales<sales@ashdjhsad.com>' . "\r\n";
mail($to,$subject,$message,$headers);

Email is delivered perfectly to my mailbox but not displaying CSS Colors, Width, how can I fix this?

On CSS of <table style='width:700px; background-color:#F9F9F9; padding:20px;'> is working no other inner CSS is working.

Karthik Malla
  • 5,570
  • 12
  • 46
  • 89
  • What Inbox using? did you try `color:#333 !important;`? Maybe it's because Inbox overwrite color style. – Moshtaf Aug 30 '14 at 04:04
  • It seems your'e using `!important` in a wrong way. – Moshtaf Aug 30 '14 at 04:07
  • @Moshtaf - Using Gmail, but !important too didn't work as I used font-weight:bold; !important; which didn't bold my text. – Karthik Malla Aug 30 '14 at 04:07
  • @Moshtaf - Yeah, sorry I just corrected it to `font-weight:bold !important;` in my code but still the same issue. – Karthik Malla Aug 30 '14 at 04:09
  • Did you try this? `` – Moshtaf Aug 30 '14 at 04:11
  • Welcome to the joys of HTML e-mail. First off, don't send HTML e-mail yourself... use a pre-built class like Swiftmailer or similar to take care of it for you. Otherwise, you have to worry about generating the headers yourself, which is not easy. Next, understand that every e-mail client does it a bit differently. Use a service like Litmus to test your e-mails to make sure they show up in the clients you care about. – Brad Aug 30 '14 at 04:11
  • @lock: i'm working with Gmail and send many email to that using code and don't have this problem. Check this: http://jsfiddle.net/mq1w9xp4/ did your email look like different form this? – Moshtaf Aug 30 '14 at 04:19
  • @Moshtaf - I did check this in jsfiddle and I am wondering why can't I see colors in Gmail also width not working :( – Karthik Malla Aug 30 '14 at 04:34

1 Answers1

0

Don't use the style attribute, as not all email clients respect it.

Instead, you want to use old, ugly HTML4 code.

<td><font color="#333333>Coupons Offered</font></td>

See more about dealing with HTML emails on my answer here: Best practices for styling HTML emails

Additionally, this support matrix is very useful when dealing with emails and your intended targets: https://www.campaignmonitor.com/css/

Community
  • 1
  • 1
Michael Irigoyen
  • 22,513
  • 17
  • 89
  • 131