Fix handling of email .preheader with Microsoft OWA

[timabbott]

Some emails clients (at least Outlook Web Access) don't properly respect the various things we try to do to hide the .preheader, and one ends up with weird display artifacts like this:

I went back and forth with the reporter in PMs and tried a various things without much success; the only thing that's successfully resolved the problem is this experiment:

how about putting the ".preheader" before the ".illustration"?
that fixes the problem, but adds a top padding of 20px or so.
I'm not sure how .preheader works, but if you move it below it also fixes the problem with OWA now, unsure if it would still do it's job.

I think moving it below the table would break the preheader functionality, but moving it above the illustration might be fine? We should test how it looks in gmail to find out whether we're creating weird padding issues -- if the extra padding is just in OWA and it looks mostly fine, we could live with that. And maybe we can add some CSS tweaks that even get rid of that.

@rishig @hackerkid can you drive further work on this?

[zulipbot]

Hello @zulip/server-development members, this issue was labeled with the "area: emails" label, so you may want to check it out!