我的某个网站的边距/行高有问题。
我正在使用Jquery脚本在每个部分的第一个字母中创建一个Drop Cap效果,这会为它们添加一个类。你可以看到有两种类型的dropcaps。 Google Chrome无法正确呈现较小的版本。您可以与其他浏览器进行比较,看看差异。
有关为什么会发生这种情况的任何想法?是否有修复/黑客攻击?
答案 0 :(得分:3)
我设法通过调整line-height
代码上的p
来解决问题。
我将它调整为1.8 - 更少,第三行副本无法在下降盖下方流动。
查看图片:
alt text http://web17.twitpic.com/img/126705561-f3957c59ceac70c081953d4ce00c9d5e.4c35afb0-full.png
alt text http://web14.twitpic.com/img/126705484-0b710f203011f574c598d698fffce8ab.4c35afb0-full.png
答案 1 :(得分:1)
解决方法是将margin-top:-1px
设置为.dropcap
CSS规则..
必须与文本呈现的大小有些不一致..
答案 2 :(得分:1)
将行高改为1.8em对我有用。但总的来说,这个问题很难避免,因为不同平台甚至跨浏览器的字体呈现方式不同。