CSS：第一个字母在段落的边界被切断

Question

我的首字母大写有问题。请看看这个页面http://www.madebypaz.com/portfolio/interaction/user-centred-design

第一封字母在webkit的顶部被切断，Firefox把它压到一行。你能给出一些建议，如何解决这个问题，所以它只能跨越两条线，并且不会在顶部被切断？

任何指针非常赞赏。

Answer 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行...