调整 Material 图标的宽度

Question

我将 Angular 与 Angular Material 一起使用，并且有一个带有图标和文本的 md 按钮。你可以在这里看到它：

代码：

<md-button layout="row" style="width:80px;" layout-align="center center" ng-href="">
  <div class="material-icons" style="font-size: 36px;">keyboard_arrow_left</div>
  <div translate>Back</div>
</md-button>

图标的宽度为 36px。我希望它更小，例如24 像素。设置元素的宽度 <div class="material-icons"> 没有帮助，因为图标左侧仍然有相同的大填充。

如何给图标一个24px的宽度，并使其在这24px内居中？

Answer 1

图标的大小由您对该图标的 font-size 控制。如果你想把它移到右边，你可以添加负数 margin.

.material-icons {
    margin-right: -10px;
}

调整 Material 图标的宽度

Adjust a Material Icon's Width

css

angularjs

angular-material