与移动设备上的顶部不同 space - 如何修复？

Question

我希望在标题上用背景色突出显示某些词。所以我在我的标题中使用

<h2 class="sppb-title-heading">Ihre <span>Vorteile</span> bei uns</h2>

在CSS中我添加了：

h2.sppb-title-heading span{
   background: #edbd4f;
   color: #4e7cb7 !important;
   padding: 0 5px !important;
   line-height: 100% !important;
}

在移动设备上我遇到了问题，文本没有居中。顶部可见的背景较少。当我使用普通桌面上的任何浏览器检查该站点时，它看起来不错，但此时我使用移动设备查看该页面是错误的。

这是它的样子：

问题

这里是link to page

有人可以帮我解决这个问题吗？ kweb

Answer 1

快速解决方法是调整填充。

h2.sppb-title-heading span{
   background: #edbd4f;
   color: #4e7cb7 !important;
   padding: 5px 5px 0 !important;
   line-height: 100% !important;
}

在数字计数器上：

#counter .sppb-animated-number{
        font-family: 'LithosPro-Regular';
        font-size: 65px;
        color: #fff;
        line-height: 100% !important;
        padding: 10px 5px 0;
}

与移动设备上的顶部不同 space - 如何修复？

Different space to top on mobile devices - How to fix?

html

css

margin

line-height