锚标签卡在其容器内？

我有一个索引链接到整个页面的部分，但由于某些原因，他们只会带我到容器的顶部包含部分。请参见下面的代码（所有部分都是由下面列出的相同部分的代码（减去部分容器），但不同学校）：锚标签卡在其容器内？

<!-- 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>

我一直在尝试整夜弄清楚的问题！我在这里错过了什么吗？为什么我的链接不会去他们指定的锚？

来源

2015-09-29 Vanderbeam

可以复制在JS小提琴的问题？你的编码看起来正确。我会怀疑这是CSS的一部分，您可能需要添加一些填充以在锚点上方创建间距。 – Lee

@Lee http://jsfiddle.net/tze3uhrL/ – Vanderbeam

似乎在JSFiddle中可以正常工作。

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

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

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

来源

2015-09-29 10:39:34 Lee

这里有更多的代码。因为NDA，我没有把它全部粘贴。该部分乘以大约12（当然，全部都有自己独特的ID）。页面上有足够的空间。更令人讨厌的是，我添加了一个固定的“回到顶部”功能（在此问题已经建立之后，请注意），因为内容太多而且工作得很好。 – Vanderbeam

如果您可以更好地表示您的网页，可能会更容易一些，如果这是个问题，可以用占位符文本替换文本？但是可以更精确地显示页面上的样式和其他元素。 – Lee

这是最残酷的事！我从我的文件复制/粘贴确切的代码到一个jsfiddle，它工作正常！当然，它在JDfiddle之外无法正常工作，但这是否意味着什么？东西在？ – Vanderbeam

锚标签卡在其容器内？

回答

相关问题