css - 垫工具栏内容对齐

在这个例子中，我想让内容左右对齐。

我想要左侧的图标，中间的文本和最右侧的用户名。

我该怎么做？

最佳答案

您可以执行以下操作来完成此操作。

将 mat-icon 移动到容器的顶部以将其放在第一位。

 <mat-toolbar-row>
   <mat-icon class="example-icon">verified_user</mat-icon>

将 example-spacer 类应用于中间的文本。

<span class="example-spacer">Second Line</span>

将以下内容添加到 toolbar-multirow-example.css 中的 example-spacer 类

text-align: center;

之后的用户名

<span>User Name</span>

堆栈 Blitz

关于css - 垫工具栏内容对齐，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/53935729/

相关文章：

javascript - 动态排列 md-dialog 标签