锚标签卡在容器内？

Question

我有一个索引链接到整个页面的各个部分，但由于某些原因，所有这些索引只会将我带到包含这些部分的容器的顶部。请参阅下面的代码（所有部分都由下面列出的相同部分代码（减去部分容器）组成，但有不同的学校）：

<!-- Outter container -->
  <div class="container chapter">

<!--Section Index-->
    <div class="container chapters-index">
      <a href="#school-id">School</a> |    
 </div>

<!-- Section container (this is where the anchors link to)-->
    <div class="container chapters">

<!-- Section to be linked to -->
        <div id="school-id">
          <div class="col-md-5 chapters">
            <img src="images/chapters/school-logo.jpg" class="school responsive">
            <h6>Meets weekly on Wednesday after school, <strong>3:30pm-6pm</strong>.</h6>

            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis euismod suscipit gravida. Donec non magna pretium, commodo nisl nec, sollicitudin enim. Phasellus lobortis lectus a urna auctor maximus. Donec nibh metus, finibus et rhoncus ut,
              aliquam sit amet mauris. Sed odio libero, pretium nec placerat ac, commodo quis mi. Integer aliquam mauris lacus, at finibus nibh fringilla id. Ut congue sit amet tortor nec laoreet. Duis posuere finibus nisi, sed fermentum sapien. Curabitur
              porta interdum elit, nec ultrices neque aliquet at. Vivamus eleifend est sit amet hendrerit vehicula. Nulla malesuada metus eget luctus consequat.</p>

          </div>
        </div>

    </div>
  </div>

我一直试图弄清楚这个问题！我在这里错过了什么吗？为什么我的链接没有进入他们指定的锚点？

Answer 1

在您链接的JSFiddle中似乎对我有用。

下面的图表显示了school-id div的边界，这是正确的吗？图像是学校div的一部分，而不是顶部的类别？

图像出现在锚的顶部，我认为这是正确的吗？

http://jsfiddle.net/tze3uhrL/1/