移动设备顶部的不同空间 - 如何解决？

问题描述

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

<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

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

解决方法

一个快速的解决方法是调整内边距。

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;
}