CSS :first-letter 在段落的边界处被截断

【问题标题】：CSS :first-letter gets cut off at the border of the paragraphCSS :first-letter 在段落的边界处被截断
【发布时间】：2011-04-04 08:08:12
【问题描述】：

:first-letter 在 webkit 的顶部被截断，Firefox 将其推下一行。你能给出一些建议如何解决这个问题，让它只跨越两行并且不会在顶部被切断吗？

非常感谢任何指针。

【问题讨论】：

【解决方案1】：

问题出在这条规则上：

.single-item .post-body p + p + p::first-letter,
article.blog .single-item.text p + p::first-letter { ... }

有问题的属性是行高和高度。我发现这些值有效：

line-height: 1em;
height: 0.7em;

但是，这会导致它跨越 3 行...

【讨论】：

谢谢！有没有办法以某种方式将第一个字母向上推，使其仅跨越 2 行？我尝试了 display:block 然后定位它，但这根本不起作用。奇怪的是，相同的 CSS 在此页面上完美运行：blog.paznow.com。我尝试了所有方法，但不知道是什么原因导致其他页面出现剪裁。
@Paz 在 Chrome 的开发人员工具中检查该段落并分析其计算样式。