email-bugs
email-bugs copied to clipboard
Yahoo will ignore embedded css if it is directly preceded by a comment
Example:
ul { padding: 0; }
was ignored. Yahoo added its .undoreset ul { padding-left: 40px; }
body {
font-family: Helvetica, Arial, sans-serif;
font-size: 12px;
color: #333333;
line-height: 16px;
}
/*comment in code*/
ul {
padding: 0;
margin: 0 0 0 15px;
}
ul ul { margin: 0 0 5px 15px; }
li { margin: 0 0 5px 0; }`
Corrected example:
Once the comment has been removed, the ul { padding: 0; }
will be respected.
body {
font-family: Helvetica, Arial, sans-serif;
font-size: 12px;
color: #333333;
line-height: 16px;
}
ul {
padding: 0;
margin: 0 0 0 15px;
}
ul ul { margin: 0 0 5px 15px; }
li { margin: 0 0 5px 0; }`
Just tested to verify this still happens. It looks like Yahoo replaces CSS comments with its own div
wrapper ID:
<div id="yiv4236027226">
<title>Document</title>
<style>
#yiv4236027226 body {
font-family: Helvetica, Arial, sans-serif;
font-size: 12px;
color: #333333;
line-height: 16px;
}
#yiv4236027226
#yiv4236027226 ul {
padding: 0;
margin: 0 0 0 15px;
}
#yiv4236027226 ul ul {
margin: 0 0 5px 15px;
}
#yiv4236027226 li {
margin: 0 0 5px 0;
}
</style>
<div>
<ul>
<li>test</li>
</ul>
</div>
</div>
So the selector becomes #yiv4236027226 #yiv4236027226 ul { }
which doesn't match anything.
Yep, that's the bug. Thanks for clarifying that.
Just tested this again with the above CSS - Yahoo Mail still replaces the comment with the unique email #ID. But if you need to use CSS comments, it doesn't strip this single line comment:
// comment in code {}
However the single line comment above is stripped by Gmail as it parses it as invalid CSS and removes the whole
It looks like Yahoo Mail has fixed this bug. I tested using the CSS above and Yahoo removed the comment instead of replacing it with the message's wrapper ID. Can someone else confirm?
Wow, I confirm. Finally.
@hteumeuleu can this issue be set to closed now?
Absolutely!