They've historically been very restrictive about what they do and don't allow in emails—iirc, they even stripped CSS blocks entirely until recently. Even now they only accept a specific list of properties, selectors, and queries.[1] My impression is it's broadly in the name of security: if you allow arbitrary content inside a Google webpage, it's easy to imagine phishing running amok.
The solution is very simple actually: place user-generated content like emails inside an iframe, after stripping out the JS. Add a CSP header disallowing external resource loads until the user confirms explicitly.
This way, content using position:absolute can't escape the iframe borders, and the mail gets to enjoy full responsiveness.
a gentle hint: if you find yourself writing "the solution is very simple" and you're talking about something at the scale of gmail (or Firefox, or AWS, or Linux, or...), you can probably be assured there are a few things you haven't considered.
iframes require explicit sizing, it's hard to adapt the size of an iframe to the size of its contents. Gmail, for example, doesn't use iframes to display message contents.
There is a request to HTML to let iframes take the height of their contents (the main thing anyone wanted from <iframe seamless>, which is now removed from HTML), but it's gone nowhere as of yet.
I'd bet part of it was making sure that it wouldn't leak information. They've spent a good deal of time on that in the past few years (images in email are fetched by google, rather than your browser). If done incorrectly it could be used to help fingerprint the email client in some way (screen size, which queries are listened to, etc.) which could enable another email to be sent that attacks a vulnerable device (think stagefright like media attack).
