AMP网站固定Header与图片重叠的CSS修复技术求助

• 保留固定Header的CSS并补充层级控制，确保Header始终在内容上方：

nav.amphtml-title {
    position: fixed;
    width: 100%;
    z-index: 100;
}

• 给页面主内容容器（或直接给body）添加顶部内边距，值等于Header的实际高度，让整体内容下移避开固定Header：

body {
    padding-top: 60px; /* 替换为你Header的实际高度 */
}

• 无需修改AMP默认的.i-amphtml-layout-size-defined .i-amphtml-fill-content样式（这是AMP组件的核心布局规则，修改易引发其他异常）。若图片所在父容器未自带相对定位，手动补充：

.i-amphtml-layout-size-defined {
    position: relative;
}

调整后，固定Header会保持在顶部，图片及其他内容会被内边距推至Header下方，既保留AMP组件正常布局，也不会出现重叠问题。

内容的提问来源于stack exchange，提问作者cosiek