Outlook iOS app adding `display: table !important` inline

[M-J-Robbins]

Outlook on iOS is adding display: table !important inline to all table elements.

Reported by Henrik Boy on EmailGeeks here

I tested this on 4.2207.0 and it wasn't happening, Henrik had 4.2208.0 and was seeing the issues. I've since updated to 4.2209.1 and I'm seeing it now too

<style>
    .foo{
        background:red;
        display:none;
    }
</style>

<table class="foo">
    <tr>
        <td>test</td>
    </tr>
</table>

will become

<table class="foo" data-ogsb="" style="font-style: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: auto; text-align: start; text-indent: 0px; text-transform: none; white-space: normal; widows: auto; word-spacing: 0px; -webkit-tap-highlight-color: rgba(26, 26, 26, 0.3); -webkit-text-stroke-width: 0px; text-decoration: none; border-spacing: 0px; caret-color: rgb(225, 225, 225); color: rgb(225, 225, 225); font-family: -apple-system, HelveticaNeue; font-size: 20px; -webkit-text-size-adjust: 125%; background-color: rgb(234, 0, 0) !important; display: table !important;">
    <tbody>
        <tr>
            <td>test</td>
        </tr>
    </tbody>
</table>

I also tested setting display:none and display:none !important inline on a table and that didn't work either.

This means that you can no longer set display:none or any display value other than table on a table.

A simple workaround from Steven Sayo is to wrap the table in a div and target that instead.

[M-J-Robbins]

Just seen a report that this may have been fixed https://emailgeeks.slack.com/archives/C1Z733K1P/p1648126345352659?thread_ts=1647270468.840499&cid=C1Z733K1P

I'll try and run some more tests soon to confirm it's fixed and on which version.

[M-J-Robbins]

I'm still using version 4.2209.1 but the issues appears to be fixed 🤷‍♀️

[lukepaperless]

Hi, I can't view the slack referenced above, but this issue seems to have arose again, which causes the issues shown here: https://answers.microsoft.com/en-us/outlook_com/forum/all/outlook-mobile-on-ios-styling-issue/b6c6e221-e062-47a3-a263-b4e4dee5e1e3

Outlook IOS Version: 4.2214.0

Did this ticket get closed because you found a workaround, or that the issue was resolved?

[M-J-Robbins]

@lukepaperless I had a quick look at that thread and I think that is a different issue.

I quickly tested some of the code that was shared and saw it broke the layout but it didn't add display: table !important so I think there is something else going on