Different e-mail clients render HTML e-mails differently. But there are a few basic practices you should adhere to (see references below).
In looking at your code, there's a good chance your problem stems from the use of embedded styles. Here's what MailChimp has to say about that:
Because browser-based email applications, such as Gmail, strip out
<head> and <body> tags by default, always use inline CSS over embedded
CSS.
So, the padding: 0 and margin: 0 in your head section are possibly being ignored or overridden.
Designing HTML e-mails is not like designing HTML websites. There's a huge technology gap between e-mail clients and web browsers. It's as if browsers keep evolving, but e-mail clients are stuck in 1998.
In the world of HTML e-mail, embedded and external styles are bad, inline styles are good, javascript is bad, tables for layout are good. In this world, old-school coding methods are alive and well.
More information:
与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…
