Email clients are known for their poor (and inconsistent) support of HTML and CSS. MJML is a markup language designed to reduce the pain of coding a responsive email.
https://github.com/mjmlio/mjml
Example MJML code:
<mjml lang="en">
<mj-head>
<mj-include path="./styles.css" type="css" />
<mj-font name="MyFont" href="https://cdn.mysite.com/fonts/MyFont.css" />
<mj-all font-family="MyFont,-apple-system,blinkmacsystemfont,roboto,helvetica neue,segoe ui,arial,sans-serif"></mj-all>
</mj-head>
<mj-body>
<mj-section>
<mj-column>
<mj-include path="_header.mjml" />
<mj-text>
<p>Hello World!</p>
</mj-text>
<mj-include path="_footer.mjml" />
</mj-column>
</mj-section>
</mj-body>
</mjml>
Then running mjml input.mjml -o output.html
will generate ugly HTML code,
that can be rendered correctly by email clients.