Materialise Icons,为什么 arrow_right 比 arrow_left 占用更多 space

Materialize Icons, why is arrow_right taking up more space than arrow_left

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">     
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

<div class="col s12">
   <a class="btn right light-blue lighten-3 black-text" id="addDataBtn"><i class="material-icons">arrow_forwards</i></a>
   <a class="btn left light-blue lighten-3 black-text" id="addDataBtn"><i class="material-icons">arrow_back</i></a>
</div>

<div class="col s12">
   <a class="btn right light-blue lighten-3 black-text" id="addDataBtn"><i class="material-icons">arrow_back</i></a>
   <a class="btn left light-blue lighten-3 black-text" id="addDataBtn"><i class="material-icons">arrow_back</i></a>
</div>

从上面的代码片段可以看出。出于某种原因,fowards_arrow 和 back_arrow 图标占用了不同数量的 space。这是疏忽吗? 我怎样才能使它们对称?

编辑:添加了具体化样式表,以便其他人可以复制代码

删除 arrow_forwards

中的 s
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">     
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
    
    <div class="col s12">
       <a class="btn right light-blue lighten-3 black-text" id="addDataBtn"><i class="material-icons">arrow_forward</i></a>
       <a class="btn left light-blue lighten-3 black-text" id="addDataBtn"><i class="material-icons">arrow_back</i></a>
    </div>