Css &引用；：第一个字母；伪元素-删除移动设备上的间距

我想用一种不同的风格来设计第一个字母，它在桌面上的每个浏览器和每个浏览器的宽度上都有效，但是在手机上（在iphone和windows phone上测试），我在字母的顶部和底部都有一些奇怪的间距

桌面：

流动电话：

这是我的CSS：

p:first-of-type:first-letter {
  border: 1px solid red;
  display: block;
  float: left;
  font-size: 5.6em;
  font-weight: bold;
  line-height: 1em;
  margin-top: 8px;
  padding-right: .2em;
  padding: 0;
  text-transform: uppercase;
}

---

.

我通过添加：

line-height: .6em;