iOS Mail - Bad Rendering of Attachment Buttons - Any Solution?

Question

I've created a HTML email which I'm sending from a .NET site, and the email for the most part is rendering fine. However, in iOS Mail (on the iPhone and iPad), the attachment button the app adds at the bottom of the email renders in an extremely unattractive way. See the screenshot below.

Notice the overlapping and the cut off. It is happening in iOS 7, but it's not great in iOS 6 either. I've seen it occur before in emails received from others, but this is the first time I've seen it appear in my own.

I've checked the HTML is valid (ie: no unclosed tags, etc) and there isn't really anything unusual going on - the HTML is just some nested tables.

So does anyone know what is going on and how to solve (or at least mitigate) it? Or is this just a general quirk/bug of Mail that can't be solved?

Answer 1

I have experienced the same issue in iOS 7.03-7.04 (possibly prior too). After much troubleshooting, it appears that is the html content's width exceeds 360px, the Tap to Download attachment boxes begin to overlap. I have asked Apple for support on this and am awaiting a response. The width of the html content should have no effect on how the attachments are displayed, but it does. Does anyone else know of a fix for this? I have emailed reports with multiple columns that cause this to occur. I have included a few cropped screenshots of the overlapping. Included in my support request at Apple is this post so if anyone else is experiencing this issue, please post your details here.

https://www.dropbox.com/s/e651pa6mjxq485e/ios7_email_width_overlapping.jpg