html - CSS 溢出/z-index 问题 - 标记未在 SAFARI 中显示

Question

看来我的脑子有点过载了。我不明白为什么“标记”在 Safari 中没有正确显示 - 而在 chrome 中，它工作正常。

我认为这是一个溢出问题，因为并非所有地方都设置了该属性。 我已经尝试通过 Safari Dev 工具设置 overflow: visible 和适当的 z-index，但到目前为止还没有成功。希望大家多多指教。

问题出在以下网站 http://apop.burningpips.com/ 如果您向下滚动到“社区”部分(CSS 类 - 请打开检查器)，您可以看到所有元素的顶部都有一个“标记”(最新的博客文章)。第一项上的标记就像在 Safari 中被裁剪掉一样。

基本上，我们有:

<section class="attractions">[...]</section>
<section class="community">
  <div class="prompt top">[...]</div>
  <div class="prompt bottom">[...]</div>
  <div class="container">[...]</div> <!-- This should overlap all -->
  <div class="cta-container wood wood2">[...]</div>
</section>

“容器”div 包含带有错误标记的代码。我无法向自己解释为什么这不起作用。请在 Safari 和 Chrome 中访问以查看差异。

我希望我提供了所有必要的信息。如果没有，请告诉我是否可以做进一步的事情。

提前致谢。

Answer 1

在尝试设置 overflow: visible 和 z-indexes 的所有变体后，我发现了问题:

它是类为“post-container”的 div 的 css 属性

--> 列数:2;

--> -webkit-column-count: 2;

我为第一个博文元素添加了 margin-top，为最后一个元素添加了 margin-bottom。

这很有帮助。

感谢大家对此的关注。