css - 滚动时保持 div 及其子项固定

Question

当用户滚动时，如何固定上层的div，让下层的div越过他？我不知道图像的高度是多少。 http://codepen.io/anon/pen/oxOPXv

// Stays in position
<div class="col-md-12 top-wrapper">
  <div class="container image-wrapper">
    <img src="http://placehold.it/750x550" />
  </div>
</div>

// moving up and over .top-wrapper (also other content below this)
<div class="bottom-wrapper">
  <div class="container">
    <div class="col-md-3 sidebar">
      <p>Lorem</p>
    </div>
    <div class="col-md-9 main-div">
      <p>Lorem</p>
    </div>
  </div>

</div>

Answer 1

您在 CSS 中拼错了“position”。你把最后一个“我”漏掉了。应该是:

.top-wrapper {
  background-color: #eee;
 position: fixed;
}