无法在光滑的画廊中的图像上显示文本

Question

我在“光滑”图库中的多个图像上添加文本时遇到麻烦。我可以得到想要在图库的第一张图像上显示的文本，但是将文本添加到其他幻灯片时，它们只会出现在第一张幻灯片上。

我在文字叠加层中使用了以下CSS：

.classTextOver{
  position: absolute;
   font-size: 16px;
   color: white;
   top:60%;
  left:18%;
}

任何帮助将不胜感激。

您可以在此处找到代码段：https://jsfiddle.net/dkxq3ztg/1/

Answer 1

此答案看起来可能会为幻灯片放映带来其他问题，但是如果使用相对位置，则可以解决文本问题。将此替换为.ClassTextOver：

.classTextOver {
position: relative;
top: 300px;
font-size: 40px;
color: white;
font-family: 'champion';
font-weight:normal;
left:100px;
}