html - html 电子邮件页边距的照片outlook2013

Question

我正在制作 html 电子邮件。我在gmail中做了这个：

但在前景中它看起来像这样：

我怎么解决这个问题？

<img src="http://leavingstone.me/dev/Images_For/MoneyMan/FB.png" align="left" style="width: 29px; height: 29px; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; margin: 2px;display: block;line-height: 100%;">

JSFIDDLE

Answer 1

检查border-radius电子邮件是否支持：链接。
更好地使用图像。
此外，仅当通过浏览器查看电子邮件时，wendor 前缀才有效。

尝试margin使用填充进行更改：

.soc {
  width: 15px;
  height: 15px;
}
.wrapper {
  padding: 2px;
  display: inline-block;
}
.facebook {
  background-color: blue;
}
.twitter {
  background-color: cyan;
}
.google-plus {
  background-color: red;
}

<div class="socials">
  <div class="wrapper">
    <div class="facebook soc"></div>
  </div>
  <div class="wrapper">
    <div class="twitter soc"></div>
  </div>
  <div class="wrapper">
    <div class="google-plus soc"></div>
  </div>
</div>