html - 停止折叠位置为 :fixed 的 div

Question

我在 twitter bootstrap 的网站上工作，希望我的 content div 放在我的 fixed header 的正下方。问题是我的 header 有 position:fixed ，这使它脱离了布局流并折叠了我的 div，因此它看起来没有任何高度。我不想添加 height，因为我的 header 可能会根据其内容改变高度。

这是我的代码:http://jsfiddle.net/7nSss/1/

这里有答案How to position a html element under a fixed div但我不想使用 margin 或 padding，因为我的固定 header 可能会改变高度。

Answer 1

有两种方法可以解决:

CSS方式

只需制作一个标题的隐藏副本并将其插入到内容之前，并使用 position: static 和 visibility: hidden 即可。

JS方式

动态获取页眉外部高度并将其用于上边距，如下所示:

var topPadding = elem.outerHeight();
$body = $('body');
$body = $body.css('padding-top', topPadding + 'px');