与Bootstrap 3重叠的部分

Question

我正在创建一个bootstrap模板，我遇到了问题。

section id="content-one"显示在页面顶部。我似乎无法找到解决方案将它放在全屏标题下。

需要定位于此： pic

以下是代码：http://codeply.com/go/8iYGenpntB

Answer 1

问题在于<section id="hero">中的元素是绝对定位的，这使得它们脱离正常的文档流程，而其他元素将忽略它们在页面上的定位（即假装它们不在那里）。这就是<section id="content-one">高于＆＃34;主标题＆＃34; ，即<section id="hero">内容的原因。具有绝对定位的元素是.hero-wrapper和.hero-container。

我不确定最终的布局应该是什么，也不确定它的要求所以除了指出问题的根源之外，很难推荐。您可以使用填充和边距来获得<section id="hero">您想要的高度/尺寸。