Home/ Questions/Q 7968921
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-04T07:09:14+00:00

I use a simple email function and it messes all my css.. it puts

  • 0

I use a simple email function and it messes all my css.. it puts all the divs one below another instead of in the wrapper div..
is there a way to overcome it?

 function email_template($app_link, $img_link, $app_name){
       $message='<html>
        <head>

    <title>Purchase Successful!</title>
         </head>
            <body>

      <div id="pic" style="position:relative; text-align:center; margin:0px auto;width:320px; height: 480px;">
       <a href="http://1111111111111edapps.com">  
       <div id="logo" style="position:absolute; width:130px; height:35px; z-index:99999;top:5;">
       </div>
       </a>
        <div id="clickHere" style=" position:absolute;width:320px;height:50px;z-index:99999;top:60px;text-align: center;">
            <span id="clickHereText" style="font-size:140%; color:white;"> <a href="'.$app_link.'" style="color:yellow">Click Here</a> to Download<br/>
                 your phonemate app
                 </span>
        </div>

        <div id="appImg" style="position:absolute;width:50px; height:50px;z-index:99999; left:50px;top:210px;">
            <img src="http://1111111111111edapps.com/'.$img_link.'" width="53px" height="53px"/>
        </div>
        <div id="appLabel" style="position:absolute; width:50px; height:10px; z-index:99999; text-align: center; left:50px; top:260px;">
            <span style="color:white; font-size: 50%;">'.$app_name.'</span>
        </div>

        <div id="downloadLink" style="position:absolute; width:320px; height:30px;  z-index:99999; bottom:0px; text-align: center;">
            <a href="'.$app_link.'" style="color:yellow">Download our app on 1111111111111edApps.com</a>
        </div>
       <img src="http://1111111111111edapps.com/email/images/1111111111111edAppEmail.jpg"/>
    </div>
       </body>
   </html>';

  return $message;


 }

The email function works.. but the divs should be inside ..pic div..but they are outside it.. Is there a way to deliver the email and have it being rendered the same as when i test it on a regular page?

Extra note: my php:

     $to = /*TO EMAIL ADDRESS*/"";
 $subject = "Hi!";
$body=email_template('http://1111111111111edapps.com/app_dl.php?app_id=34', $app_pic, $app_name);
echo $body;
 $headers  = 'MIME-Version: 1.0' . "\r\n";
 $headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";
 if (mail($to, $subject, $body,$headers)) {
   echo("<p>Message successfully sent!</p>");
  } else {
   echo("<p>Message delivery failed...</p>");
  }
  }
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I ran your code through the W3C markup validator, and it seems that you may need to reconsider your approach here:

    <a href="http://1111111111111edapps.com">
<div id="logo" style="position:absolute; width:130px; height:35px; z-index:99999;top:5;">
</div>
</a>

    Put an inline element inside the a element (such as a span with display: block; applied). I’d be willing to wager (at this moment in time) that the illegal div is causing you some issues.

    Remember, email clients aren’t designed to handle HTML errors as well as web browsers do, and while support in some clients is very good, others can be quite far behind (I’m looking at you, Outlook 2007+).

    You didn’t mention which email clients you’d tested and which were giving you the problems, so if correcting your markup doesn’t fix it, give us a little more info.

    • 0