CODEWITHSUNDEEP
htmliosoutlookhtml-emailmeta-tags
sadjohn
sadjohn

Reputation: 1

Outlook on iOS turning dates into blue links

I have an html email that uses a blue background and white body text.

iOS turns dates, addresses, and email address links blue. I've been able to change these links back to white using this workaround in the header css:

      a[x-apple-data-detectors] {
        color: #fffffd !important;
        font-size: inherit !important;
        font-family: inherit !important;
        font-weight: inherit !important;
        line-height: inherit !important;
      }

That fixes my issue in iOS Mail programs with one big exception: Outlook for iOS Date links. Outlook for iOS is converting the date in the email text (e.g.

TODAY'S DATE

) into a clickable link and changing the link color to Outlook blue, which on my blue background makes it nearly invisible.

Outlook for iOS also seems to not respect the meta format-detection tags. The following has not fixed my issue either: <meta name="format-detection" content="date=no">

Does anyone have any ideas on how to target Outlook for iOS' date format specifically so I can make the color of the text white?

I also tried:

      a[href^="ms-outlook"]{
         color: #ff00ff !important; 
      }

but it doesn't seem like Outlook honors css [attributes]

Upvotes: 0

Views: 472

Answers (1)

Nathan
Nathan

Reputation: 5269

Outlook iOS adds it's own heavily specific style with 2 IDs.

You are able to override it by add two of your own to the HTML, and then using the following CSS:

#converted-body #wrapper a[x-apple-data-detectors] {
    color:inherit !important;
      text-decoration: inherit !important;
  }

Here I've used "#converted-body" because that's what Outlook iOS changes the ID on the <body> tag to (different email clients do different things to the body tag). It might be simpler to use two wrapping divs with IDs on them though.

Judging by your approach, you already use <a> tags with inline color and text-decoration, which is what you need for links that you do want styled.

Upvotes: 0

Related Questions