带有导轨4的锚标签很奇怪

Question

好的，所以我遇到了一个非常非常奇怪的问题让我熬夜但是我终于弄明白了什么是错的，但解决方案并不理想，我想知道发生了什么。更好的是，如何解决它。

我有一个页面与许多div标签分开与id类。当我尝试使用以下方法从另一个页面链接到页面的特定部分时，我有其他页面以相同的方式完成而没有任何问题。但是，当链接到的页面没有足够的内容时会出现问题..但仍然至少是可滚动的长度..当点击链接时，而不是移动到所需的部分，它只是向底部移动。 / p>

例如，如果您点击此网站http://aquaticshelp.com/aquascape/getting-started#aquascape-main-plants并点击“准备工厂部分”，您将看到我的意思。这是一种非常不受欢迎的行为，我不确定从这里开始。

<%= link_to  'Section 1', route_path(anchor: "section-1"), class: "h4" %>

<div id="section-1">
</div>

<div id="section-2">
</div>

<div id="section-3">
</div>

编辑：添加了一些屏幕截图以明确问题

以下是您点击并包含以下代码的地方

<%= link_to aquascape_plants_prep_path(anchor: "aquascape-plants-prep-intro") do %>
          <%= image_tag("aquascaping/start/plant_prep_img.jpg", size:"140x140", class: "img-circle center-block")%>
          <%= link_to  'Preparing the Plants', aquascape_plants_prep_path(anchor: "aquascape-plants-prep-intro"), class: "h4" %>
        <% end %>

以下是指向我的地方，无论锚标记如何

我希望它去哪里，如果我点击以下内容

<%= link_to 'Intro', "#aquascape-plants-prep-intro" %>