Sticky Header - 相对于动态标题长度的正文位置

时间:2012-06-24 16:03:55

标签: javascript css sticky

尝试将标题贴在页面顶部 - postion:fixed - 正常工作

但是在这样做时,身体无法相对于标题放置 - 如果position:relative Demo

,这是可能的

我想要实现的目标 -

  • 与滚动

  • 一起移动的Sticky标题
  • 与上方标题相对高度的身体(身高是动态的)

到目前为止我做了什么:DEMO

我试图找到一个纯CSS (甚至可能吗?)解决方案,但一直没有成功 - 任何帮助都表示赞赏

1 个答案:

答案 0 :(得分:0)

尝试将padding-top: XXX添加到正文包装div,其中XXX等于标题高度。为了做到这一点(具有固定的标题和可滚动的主体)与纯CSS,您必须预先知道标题高度。否则它将覆盖身体div的顶部。