在 Safari 中使用固定位置时文本被覆盖答案

【问题标题】：Text Gets Covered When Using Fixed Position in Safari在 Safari 中使用固定位置时文本被覆盖
【发布时间】：2015-08-19 03:30:25
【问题描述】：

我最近在http://www.parkprivatewealth.com/park 为一家公司创建了一个网页，在 Chrome 上一切正常。但是，当使用 Safari 查看页面时，使用固定位置时主页标题会被截断。当我尝试向上滚动更多内容时，文本就在那里，似乎有什么东西挡住了文本。

当我去掉 CSS 中的“position:fixed”标签时，这些词又出现了，有人可能知道如何解决这个问题吗？

【问题讨论】：

我们可能需要一些小的示例代码来帮助您。
感谢@Bdawg 的回复，文本的 CSS 是这样的：.section-banner h1 { position: fixed;字体家族：'Lustria'，衬线；颜色：#FFF；字体重量：4300；字体大小：80px；文本转换：大写；文本对齐：居中；宽度：100%；高度：100%；文本转换：大写；边框顶部：1.5px 实心#fff;边框底部：1.5px 实心#fff;我玩了一堆，但它似乎不是问题，除非我固定位置，然后文本被覆盖
HTML 就是这个

与你一起成长
很遗憾，作为示例，您的 CSS 和 HTML 效果不佳，因此我更新了链接。
抱歉，更新链接是什么意思？

【解决方案1】：

问题：当标题更改为fixed 位置时，它会被拉出文档流，并且 .container 元素会向上推动。由于没有使用top、left等，h1元素随着.container向上移动

解决方案： 将padding-top 添加到 .container 元素中。它应该与标题高度相同。

【讨论】：

容器绝对是问题所在，不幸的是我似乎无法适应整个标题。我将容器向下移动（添加了 'padding-top' 元素），但当标题滚动时，容器不会随标题一起移动。有没有办法改变容器的高度和宽度？我尝试添加一个“高度”和“宽度”元素，但它似乎也改变了背景图片。感谢@bdawg 的所有帮助！
不客气，但抱歉，我不确定您在评论中要问什么：您的意思是您不能“适应整个标题”是什么意思？我并不是要您添加任何新元素，只需将 padding-top 属性添加到 .container 规则即可。这应该够了吧。为什么你希望.container 元素与标题一起移动？为什么需要改变.container 元素的高宽？
@Edward213 抱歉所有问题。只是想清除所有我不明白的东西来帮助你。
哦，对不起，我完成了现在明白你的意思，非常感谢。不幸的是，我构建的容器似乎也适用于其他许多部分，有没有办法只更改一个容器？
@Edward 您可以为需要更改的一个元素添加 id，然后添加 CSS 规则。例如，HTML: <div class="container" id="someId"> CSS: #someId { /* your properties here */ }

与你一起成长