BLOG - EMAIL MARKETING

CSS Support in MySpace Mail

DAVID GREINER - AUG 27, 2009

When it was announced last month, the all new MySpace Mail was touted as an instant big player in the web-based email client market. With 130 million global users, that would make it the 4th largest email provider in the world and the second largest in the US. Of course, these numbers refer to the total number of MySpace users, not necessarily the number that will be using MySpace Mail for general email use.

Even so, it’s still a big number. With this in mind, my first thought was to see just how good the CSS support was in the new beta. The update finally rolled my way yesterday, and I immediately fired a copy of our CSS guide test page into my MySpace account. When I opened the email, I was greeted with this scary sight…

After a hurried check of the source code, I realized MySpace was converting my character entities &lt;style&gt; code into a working <style> tag. It mustn’t have liked that very much because the rest of the email content after that was automatically removed. This is the first time I’ve ever seen an email client handle character entities like this. First lesson of the day: MySpace Mail clearly doesn’t like you including CSS in the body of HTML emails.

Once I removed the offending code, the rest of the email displayed without issue.

With that out of the way, the testing could begin.

The Results

I’ve collated the results and matched them up against CSS support in all the other popular web-based email clients. I’ve also updated our complete CSS guide (check the PDF version for the results), so you can see how MySpace compares against the other 23 email clients on the market. You can check out a summary of what I found below the results themselves.

Style Element Yahoo! Mail Yahoo! Classic Live Hotmail Gmail MySpace Mail
<style> in <head>
<style> in <body>
Link Element Yahoo! Mail Yahoo! Classic Live Hotmail Gmail MySpace Mail
<link> in <head>
<link> in <body>
Selectors Yahoo! Mail Yahoo! Classic Live Hotmail Gmail MySpace Mail
e
*
e.className
e#id
e:link
e:active, e:hover
e:first-line
e:first-letter
e > f
e:focus
e+f
e[foo]
Text & Fonts Yahoo! Mail Yahoo! Classic Live Hotmail Gmail MySpace Mail
direction
font
font-family
font-style
font-variant
font-size
font-weight
letter-spacing
line-height
text-align
text-decoration
text-indent
text-transform
white-space
word-spacing
vertical-align
Color & Background Yahoo! Mail Yahoo! Classic Live Hotmail Gmail MySpace Mail
color
background
background-color
background-image
background-position
background-repeat
Box Model Yahoo! Mail Yahoo! Classic Live Hotmail Gmail MySpace Mail
border
height
margin
padding
width
Positioning & Display Yahoo! Mail Yahoo! Classic Live Hotmail Gmail MySpace Mail
bottom
clear
clip
cursor
display
float
left
opacity
overflow
position
right
top
visibility
z-index
Lists Yahoo! Mail Yahoo! Classic Live Hotmail Gmail MySpace Mail
list-style-image
list-style-position
list-style-type
Tables Yahoo! Mail Yahoo! Classic Live Hotmail Gmail MySpace Mail
border-collapse
border-spacing
caption-side
empty-cells
table-layout

What this means for email designers

The results aren’t fantastic, but they’re also not very surprising considering the stance MySpace has typically taken with their design and standards support.

The first thing you’ll notice is that there is absolutely no support for using an actual stylesheet. You can’t externally reference a stylesheet or even add your CSS inside <style> tags. Just like Gmail, you’ll have to move all your CSS inline to get a half decent result. Most of you are doing this already (you are, aren’t you), and tools like PreMailer and our automated CSS inliner make this a click away anyway.

If you’re looking at relying less on tables for structure and trying to dabble in a little float action, you might want to reconsider that option. While MySpace Mail does offer support for float, it doesn’t offer any support for the width attribute. Unless you’re aligning images, it’s nested tables all the way I’m afraid.

The truth is, MySpace Mail’s CSS support isn’t any better or worse than Gmail’s. Considering Gmail is already considered the lowest common denominator in email design circles, this won’t mean any extra work for you, even if you eventually have a large number of @myspace subscribers. What it does mean is that we have yet another email client with loathsome CSS support that we need to convince otherwise.

One step forward, two steps back.

Straight to your inbox

Get the best email and digital marketing content delivered.

Join 250,000 in-the-know marketers and get the latest marketing tips, tactics, and news right in your inbox.

Subscribe

Get started with Campaign Monitor today.

With our powerful yet easy-to-use tools, it's never been easier to make an impact with email marketing.

Try it for free