页面上的部分的锚点链接不适用于移动设备/平板电脑？

Question

我使用锚标签在我的网站上设置各种子链接，以引导用户访问页面的特定部分。它在桌面上按预期工作，但在移动设备和平板电脑上，链接只会将用户带到页面顶部。

这是我的代码：

<a href="#one">One</a>
<a href="#two">Two</a>
<a href="#three">Three</a>
<a href="#four">Four</a>

<a name="one"></a>
<div class="one"></div>

<a name="two"></a>
<div class="two"></div>

<a name="three"></a>
<div class="three"></div>

<a name="four"></a>
<div class="four"></div>

div {
    height:300px;
    margin:400px 0;
    background:#ccc;
}

here is a pen