Question

我很难在我的网站上摆脱这个持久的5px空白eternalminerals.com

我在此屏幕截图中突出显示了它：http://s15.postimg.org/de4sjvqob/5pxwhitespace.png

在谷歌浏览器中，如果我编辑元素有一个margin-top：-5px，它会删除空格，但由于我使用的是Avada短代码，因此我无法将此样式附加到它，因为它是一个短代码：

<p style="text-align: center; margin-top: -10px; font-size: 19px !important; line-height: 42px !important; color: #FFE396!important; font-family: 'MuseoSlab500Regular', Arial, Helvetica, Sans-Serif;"><strong>That's my opinion. I am Dr George Lundberg, at large at The Eternal Minerals of Life.</strong></p>
</div>
[/raw]
[fullwidth backgroundcolor="#140100" backgroundimage="" backgroundrepeat="no-repeat" backgroundposition="top left" backgroundattachment="fixed" bordersize="0px" bordercolor="#e5e4e4" paddingTop="-5px" paddingBottom="0px"]
<br>
[ajax_load_more post_type="testimonials-widget" posts_per_page="5" pause="true" transition="fade" button_label="Click to show testimonials from real physicians"]
[/fullwidth]

如你所见，paddingTop =＆＃34; -5px＆＃34;没有削减它。有没有人对如何摆脱这个空白有更好的想法？我会继续努力让你发现我的发现。非常感谢你!!!

Answer 1

这是因为line-height占据了所有个别元素。更改身体标签的line-height后，空间将消失。以下是代码。

body {
    line-height: 0.7;
}

由于所有元素都具有单独的line-height，因此您可以为正文标记的line-height提供更低的值（<0.7）。

Answer 2

所以虽然最初接受的使用行高的答案是有效的，但是它搞砸了页面上的所有行高，经过一点点的修补，所需要的就是添加{{1}到画布元素。

这种解决方案侵入性较小，可以达到相同的视觉效果，因此我将接受自己的答案作为解决方案。对不起Masoom！

这是现在的代码：

margin-bottom: -5px;

Avada wordpress主题div之间烦人的5px空白; margin-top：-5px有效，但填充顶部：-5px不起作用

2 个答案: