How to disable color defined in a previously defined CSS class

Question

While coding and emailing HTML recently, I noticed that Yahoo! started capturing certain links and keywords, adding <span class='yshortcuts'>one that changes the colors of the text and links, which can cause some pretty bad rendering problems.

"Fix" that Yahoo! the proposed one is rather ugly (adding a range in all links and keywords that are affected) is far from a simple universal solution, especially when they apply style to seemingly arbitrary text.

I am wondering if you can just get over your class, and some can remove the attribute with css color. (Although blocks are <style>not supported on all major email platforms, Yahoo! does ... and those that don't support it gracefully ignore it.)

Sort of <style> .yshortcuts{color:none;} </style>

I know that it is color:none;invalid and does not work everywhere.

Any ideas?

Answer 1

After digging and slogging, it seems like this is the best way to deal with this problem (in my opinion).

• At the top of the letter, add this style block. This will fix most problems in most browsers.

  <style>
  .yshortcuts{color:inherit;}
  </style>
  

• , IE , <a> span, , . :.

  <a href="http://google.com" style="#c912dc"><span style="#c912dc">Google</span></a>
  

.

, , , / , ( ... Textmate):

:

(<a[^>]*style=".*color:#(\w{6}).*".*>)(.+)(</a>)

:

$1<span style="color:#$2;">$3</span>$4

Answer 2

.yshortcuts { color: auto !important }

, , - . CSS.

, , .

Answer 3

CSS

body #content .yshortcuts{color:inherit;}

Answer 4

, CSS, . , , css:

p {color: black}
a {color: blue}

, .yshortcuts a a, , a, css :

p, p .yshortcuts {color: black}
a, .yshortcuts a {color: blue}

, , color css ( , Yahoo! ). , , IE6.

Answer 5

, , , , - . , , , , , - - - Gmail, Outlook, Hotmail, Yahoo ..

, , , : http://www.campaignmonitor.com/css/