mailchimp电子邮件无法在gmail中正确显示

Question

我使用HTML在mailchimp中创建了一个模板。我尝试发送测试电子邮件，但没有显示gmail中的确切内容。当您使用gmail查看模板时，按钮位于模板的底部。我可以知道我做错了什么吗？

这是我的代码：

.container {
  position: relative;
  width: 100%;
  max-width: 700px;
}

.container img {
  width: 100%;
  height: auto;
}

.container .bt {
  position: absolute;
  top: 760px;
  left: 434px;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  background-color: #721213;
  color: white;
  font-size: 16px;
  padding: 12px 24px;
  border: none;
  cursor: pointer;
  border-radius: 5px;
  text-align: center;
  text-decoration: none;
}

.container .bt2 {
  position: absolute;
  top: 1110px;
  left: 212px;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  background-color: #721213;
  color: white;
  font-size: 16px;
  padding: 12px 24px;
  border: none;
  cursor: pointer;
  border-radius: 5px;
  text-align: center;
  text-decoration: none;
}

.container .bt3 {
  position: absolute;
  top: 1540px;
  left: 440px;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  background-color: #721213;
  color: white;
  font-size: 16px;
  padding: 12px 24px;
  border: none;
  cursor: pointer;
  border-radius: 5px;
  text-align: center;
  text-decoration: none;
}

<div class="container">
  <img src="https://gallery.mailchimp.com/b83344d645769870e9125f7a2/images/0463afae-1bff-42ac-b887-b721e137a04b.png" alt="Snow" style="width:100%">
  <a href="https://www.orochinajewelry.com/product-tag/12-12/" class="bt">SHOP NOW</a>
  <a href="https://www.orochinajewelry.com/product-category/daily-wear/" class="bt2">SHOP NOW</a>
  <a href="https://www.orochinajewelry.com/product-category/made-for-you/" class="bt3">SHOP NOW</a>
</div>

请查看屏幕截图：