在图像下显示文本而不是覆盖答案

【问题标题】：show text under image in place of overlay在图像下显示文本而不是覆盖
【发布时间】：2018-04-25 16:27:13
【问题描述】：

我想将文本从图像上方移动到移动设备上的图像下方显示。正在使用

显示图像

    <article class="post-featured post-6792 post type-post status-publish has-post-thumbnail hentry category-tech format-standard mobile-video post-visible" style="background-image: url(http://theoldcontinent.mgtestsite.com/wp-content/uploads/2017/07/Schermafbeelding-2017-07-10-om-18.54.13-530x300.jpg);" data-video="http://www.youtube.com/watch?v=GnfNta6SosA">
<div class="overlay-container">

<div class="overlay-content">
  <h2 class="entry-title">Kermit the Frog (Jordan Peterson) telling you to clean your room</h2>
</div>

目前 .overlay-content 显示在移动设备上的视频顶部。如果我使用

向下移动它

 .overlay-content {
        top: 300px;
        background-color: #fff; 
        color: #000;
    }

然后它被隐藏并且不显示。如果您向下滚动到第 4 个文本 - Kermit the frog，您只能在移动设备上看到此问题 http://theoldcontinent.mgtestsite.com/ 如何在图像下创建空间以显示文本（Wordpress 网站）

【问题讨论】：

标签： css wordpress

【解决方案1】：

margin-top: 195px; 解决了这个问题

【讨论】：