角度材料图标显然不会对齐，无论你对它做什么？尽管 Flex Layout 指令和 CSS 会影响它，但它从未对齐。

Question

示例：https://i.stack.imgur.com/8M5rR.png

我已经尝试过fxFlexAlign - fxLayoutAlign在父级上，给它一个ID，并使用display：flex + justify-content：center，在所有事情上都很重要。

问题是 - 以上所有内容都对它做了一些事情，它对CSS和FlexLayout指令做出反应，但无论如何，它看起来仍然明显错位。

经过检查，很明显它从"容器"的右下角生长，根本不关心以任何方式对齐。

在处理这些方面，我缺少什么吗？我已经浏览了文档+堆栈溢出+谷歌搜索了它，但找不到任何东西。

Answer 1

您在发布的答案的评论中提到您正在更改字体大小并触发问题。我想我记得注意到一个错误 - 至少我知道我遇到了它。除了字体大小外，您还需要相应地调整宽度和高度。实际上，最好定义类来处理所有这些问题，并将它们应用于mat-icon元素。例如：

.mat-icon-16 {
font-size: 16px;
width: 16px;
height: 16px;
}
<mat-icon class="mat-icon-16">help<mat-icon>

请注意，行高也会播放滚动，但默认情况下它是"1"，因此您不需要更改它。

Answer 2

最终将所有内容更改为带有 svg 图标的字体真棒，导入每个图标有点乏味，但保持捆绑包很小，无法真正与 svg 的价值争论。在接下来的十年里，我不会碰物质图标。