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