Jump to content

CSS in E-mail


Intelly XAD

Recommended Posts

I have a simple script to send HTML emails but when I use CSS it doesn't reads the CSS...
When I put the style inside the tags, they work fine, but that's a bit hard when you have links, because here you also have the features hover, active etc. Here is my mail script:

$to = "example@example.com";
$from = "example@example.com;
$subject = "EXAMPLE";
$message = "

<!-- Put here your HTML code -->

";

$headers = "From: $from\r\n";
$headers .= "Content-type: text/html\r\n";

$success = mail($to, $subject, $message, $headers);

if ($success)
{
echo "The email to $to from $from was successfully sent";
}
else
{
echo "An error occurred when sending the email to $to from $from";
}
?>

I would like to know which solution is posible.
1. Is there some way to use hover and active etc in the <a style="""></a> tag?
2. Is there a possibility to set the content type also to CSS (for ezample: $headers .= "Content-type: text/html text/css\r\n"; which I've already tried but doesn't work)

Well many thnx to those who replie ;-)
Link to comment
Share on other sites

  • 2 weeks later...
[!--quoteo(post=371792:date=May 6 2006, 05:33 AM:name=Intelly XAD)--][div class=\'quotetop\']QUOTE(Intelly XAD @ May 6 2006, 05:33 AM) [snapback]371792[/snapback][/div][div class=\'quotemain\'][!--quotec--]
Unfortunatly that doesn't work to :(

But it has to be possible because in many newsletters there are links made with pseudoclasses...
[/quote]

I use CSS in my Email's Below is my Email code:


[code]
// subject
$subject = '**** : Account Info';

// message
$message = "
<style>
table{
border-collapse:collapse
}
body{
font: Verdana, Arial, Helvetica, sans-serif;
color:#000000;
}
table{
font-family: Verdana;
font-size:12px;
}
input
{
border:0px solid #cc0000; background-color: #000000;
color: #FFFFFF
}
input.noborder
{
border:0px solid #cc0000; background-color: #000000;
color: #FFFFFF
}
select
{
border:0px solid #cc0000; background-color: #000000;
color: #FFFFFF
}
textarea
{
border:0px solid #cc0000; background-color: #000000;
color: #FFFFFF
}
a:link{  
    color: #cc0000;
    text-decoration: none
}
a:hover{  
    color: #cc0000;
    text-decoration: none
}
a:visited{  
    color: #cc0000;
    text-decoration: none
}
body {  font-family: arial; font-size: 10pt; color: #FFFFFF; background-color: #000000}
table {  font-family: arial; font-size: 10pt; color: #FFFFFF}
.normal {  border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px}
.style1 {
    font-size: 12pt;
    font-weight: bold;
}
</style>
<html>
<head>
  <title>**** : Text Based RPG</title>
</head>
<body>
<CENTER><img src=http://www.**** .com/Reloaded/images/main.gif><BR><BR>
Thanks for joining the fight son, Now logon with your credentials below and help out $side!
<BR><BR>
Username: $log<BR><BR>
Password: $pass<BR><BR>
Email: $email<BR><BR>
Class: $Rank<BR><BR>
</CENTER>
</body>
</html>
";

// To send HTML mail, the Content-type header must be set
$headers  = 'MIME-Version: 1.0' . "\r\n";
$headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";

// Additional headers

$headers .= 'From: ****  Auto Register Mailing' . "\r\n";


// Mail it
mail($email, $subject, $message, $headers);
[/code]

In that email i included my sites Header image, And PHP Variables. All you have to worry about is defining the Locations of things, Like the Img's and just tell it Variable Names, As for CSS its the <style>.....</style> So, Just try to put them around your CSS inside the emailing scripting. Then if that doesnt work try to tweak mine and see if that works. Other than that Email does the rest, I think anyhow. Lol.

Link to comment
Share on other sites

  • 2 weeks later...
if you want to use the <style> tag in email, you have to put it inside the <body> tag (not in the head) most email programs remove anything above the <body> tag (including the body tag). Second, use classes for everything and don't use universal styles (like a:hover {....})

I know yahoo will put your message inside a div with an id and add #message (or whatever they add) infront of all the style rules in your style sheet.
Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.