I found a very weird bug while testing my emails on Office 365. Please bear with me since it’s hard to explain.
On part of my email I have a button made up of a TD and a A tag. I have this button with a background color set and sometimes the link has the href empty (for testing purposes). After the button I have a 25px height TD to give a little bit of spacing to the next things.
I found out that when the HREF is empty, Outlook changes the HTML of my email so that the ‘blank TD’ I have now gets the inline CSS set to the A tag and the A tag is removed. Please note this ‘blank TD’ is NOT the parent of the A, it has no relationship to the A…
This is the look when HREF is empty: http://imgur.com/a/8qcLy and this is how it should look: http://imgur.com/a/YX9kA
I reduced my reproducible example to this: https://gist.github.com/anonymous/5ffb627516f9c6245fd0132fbf76dd01
On Outlook.com I checked the message source and it’s perfect, the same HTML I sent. The problem is using chrome dev tools I can see the HTML rendered when I’m seeing the email and it is changed to something like this: https://gist.github.com/anonymous/16e1d02d8832c4382d09d9514945302d
You can see that the A link tag is basically removed and the inline styles defined for that A tag are then passed on to my ‘blank TD’...
Anyone has any idea how to avoid this crazy problem? Anyone has experience with outlook.com changing the HTML of emails?!?