在jssor滑块标题中填充问题

Question

我在jssor滑块的标题中使用了填充但我看到它会导致标题出现问题，并且某些标题的内容无法正确显示。
这是我应用填充的代码。

.captionOrange, .captionBlack {
color: #fff;
font-size: 20px;
line-height: 30px;
text-align: center;
border-radius: 4px;
padding: 20px;
}

我在introduction-slider.source.html内demos-jquery使用了此代码 当我使用position: relative;标题时，它会修复上述问题，但忽略了top css属性，并且没有使用标题父级的顶部。
这是一个问题的形象

更新
下方链接顶部有一个滑块，这是我的意思。请检查其中一个标题，您可以看到.captionOrange, .captionBlue, .captionBlack, .captionSymbol的css规则，因此请向其添加padding: 20px以查看结果。当您添加padding: 20px时，它会删除部分字幕内容 jssor slider introduction theme

Answer 1

好的，我看到为什么移动字幕可以获得这些结果。我看了左上角的.captionOrange：

<div u="caption" t="CLIP|LR" du="1500" class="captionOrange" style="position: absolute; left: 20px; top: 30px; width: 500px; height: 30px; clip: rect(0px 500px 30px 0px);"> 
Touch swipe and responsive javascript image slider
</div>

在此标记的末尾，请注意以下部分：

clip: rect(0px 500px 30px 0px);

这是一个宽{500}宽，高30px（高）的clip矩形，可以将30px增加到你想要的任何值，并且你有更多的文字空间。有关clip属性的详细信息，请参阅此article。基本上clip属性将创建一个窗口，用于确定元素中可见的内容。