Div中心问题

Question

我有一个带有以下CSS的div：

.glyphicon-arrow-right  {
    font-size:25px;
    margin-top:22.66%;
    margin-left:5%;
    color: #414141;
}

使用CSS

在div中设置

.forwardbutton  {
    width:60px;
    height:60px;
    border-radius:50%;
    margin: 0 auto;
    border: 1.75px solid #414141;
    opacity: .3;
    text-decoration:none;
}

当我在电脑屏幕上调整大小时，箭头直接位于中心。但是，当我在其他设备（平板电脑，上网本/手机）上查看div时，箭头不会居中，其高度明显高于应有的值。

我想知道是否有人能够确定问题。提前谢谢。

编辑：HTML

<a href="work.html">
    <div class="forwardbutton">
        <div class="front glyphicon glyphicon-arrow-right"></div>
    </div>
</a>