Search code examples
phpemailamazon-web-serviceshtml-email

css not working in email sending using AWS

I am developing a website in php and want to send email to a user when user signs up.

I am able to do it successfully. Even i using html format and it's sending in html format.

I tried this. I know images should be uploaded to server but i will do it later.

$bodyPart = '
<body style="background-color:#FFFFFF;">

<img id="header" style="position:absolute; left:85px; top:50px; " src="images/logo.jpg" width="140" height="90" border="0" alt="" /></a>


<img id="cloths" style="position:absolute; left:275px; top:25px;" src="images/cloths.jpg" width="350" height="300" border="0" alt="" /></a>

<font size="7" style="font-family:Times new Roman; position:absolute; left:50px; top:120px;">Thank YOU</font>

<font size="3" style="font-family:Times new Roman;position:absolute;left:50px; top:165px;">For registering with our team </font>

<img id="bag" style ="position:absolute; left:290px; top:345px;"src="images/bag1.jpg" width="250" height="240" border="0" alt="" /></a>

<img style="position:absolute; left:30px; top:440px; "id="watch" src="images/watch1.jpg" width="260" height="180" border="0" alt="" /></a>

</body>

';

  $m->setMessageFromString($plainTextBody,$bodyPart);

  print_r($ses->sendEmail($m));

I should be getting this output

enter image description here

But i am getting this instead.

enter image description here

But the problem is formatting is not properly done even if it works in my localhost as a independent file. I tried to use External CSS, Internal CSS and inline CSS. But it's not working.

Any example of CSS working with html in sending email would be very helpful.

Thanks In advance.

Solution

  • UPDATED As i assumed, you have just done copy paste.Try following code. Learn HTML basic syntax.

    Don't forget to upvote & mark as answered ;)

    $bodyPart = ' 

<BODY 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Untitled Document</title> 
</head> 

<body style="margin-top:20px;"> 
<table width="600" cellpadding="0" cellspacing="0" align="center"> 


<tr> 
  <td> 
    <img id="header" src="images/logo.jpg" width="140" height="90" border="0" alt="" /></a> 
  </td>
  <td>
    <img id="cloths" src="images/cloths.jpg" width="350" height="300" border="0" alt="" /></a> 
  </td>
</tr>

<tr>
  <td>
    <font size="7" style="font-family:Times new Roman;">Thank YOU</font> 
  </td>
  <td>
    <font size="3" style="font-family:Times new Roman;">For registering with our team </font> 
  </td>
</tr>
<tr>
  <td>
    <img id="bag" src="images/bag1.jpg" width="250" height="240" border="0" alt="" /></a> 
  </td>
  <td>
    <img id="watch" src="images/watch1.jpg" width="260" height="180" border="0" alt="" /></a> 
  </td>
  </tr> 
</table>';

echo $bodyPart;

    OLDER Make it simple. Put one table in your html body & fixed the width.

    Your email body should be like following 

    $body = <<<BODY
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>

<body leftmargin="0" rightmargin="0" topmargin="0" bottommargin="0" marginwidth="0" marginheight="0">
<table width="600" cellpadding="0" cellspacing="0" align="center">
<tr>
<td>=============Your content =========</td>
</tr>
</table>
BODY;

echo $body;