无论您对它做什么，角度材质图标显然都不会对齐？尽管 Flex 布局指令和 CSS 会影响它，但它永远不会对齐

Question

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

我已经在父级上尝试了 fxFlexAlign - fxLayoutAlign，给它一个 ID 并在所有内容上使用 display:flex + justify-content:center 和 !important 。

问题是——上面所有的东西都对它做了一些事情，它对 CSS 和 FlexLayout 指令做出反应，但无论如何，它看起来仍然明显未对齐。

经过检查，很明显它是从“容器”的右下角开始生长的，并且根本不关心以任何方式对齐。

我在处理这些问题时缺少什么吗？我浏览了文档+ stackoverflow + 谷歌搜索，但找不到任何东西。

Answer 1

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

.mat-icon-16 {
    font-size: 16px;
    width: 16px;
    height: 16px;
}

<mat-icon class="mat-icon-16">help<mat-icon>

请注意，行高也会起作用，但默认情况下它是“1”，因此您不需要更改它。