div 背景颜色与其他 div 重叠，但内容不重叠答案

【问题标题】：Div background color overlaps other div, but content doesn'tdiv 背景颜色与其他 div 重叠，但内容不重叠
【发布时间】：2020-05-02 07:19:33
【问题描述】：

我从来没有见过这个

我正在创建一个基本的博客网站，现在我已经创建了页面，并且我正在添加一个 DIV 容器以用于订阅时事通讯。但是我发现，当我检查我的代码时，除了我的时事通讯 div (.newsletter-container) 之外，由于某些奇怪的原因，div 本身将自己置于另一个 div 之上，但是当我输入文本时，文本位于该 div 下方。我对此感到很困惑，不知道如何解释。

我会说自己在附加的代码笔中查看它以理解我的意思。黄色是我的实际 div，正如您在 pagenation 旁边看到的那样，它显示了该 div 的内容。但是背景颜色和内容都必须放在分页下方

提前谢谢，请告诉我我做错了什么，因为我有一段时间没有建立网站了。

我的代码：codepen

通讯代码：

.newsletter-container {
  position: relative;
  background-color: rgba(252, 250, 238, 1);
  /* padding: 50px 0px; */
  height: 200px;
  color: black;
}

<div class="newsletter-container">CONTENT OF NEWSLETTER</div>

【问题讨论】：

标签： html css layout css-position

【解决方案1】：

在上面的容器（您的分页）中，如果您添加到.newsletter-container 类，则会有很多float: left 元素：

clear: both; // or left

容器将在下一行。

这是你想要达到的目标吗？

【讨论】：