Css Mat工具栏对齐项目（左、中、右）

我开发了一个工具栏，但是我不能在同一条线上对齐元素，左、中、右

有人知道我如何对齐这些元素吗

我注意到名为Align left的元素向左对齐，Align center与中心对齐，Align right与右侧对齐

谢谢

代码

  <mat-sidenav-content fxFlexFill>  
      <mat-toolbar color="primary">
    <mat-toolbar-row>
      <button mat-icon-button (click)="sidenav.toggle()" fxShow="true" fxHide.gt-sm>
        <mat-icon>menu</mat-icon>
      </button>

      <div fxShow="true" fxHide.lt-md>
        <a href="#" mat-button>Align left</a>
        <a href="#" mat-button>Align left</a>
        <a href="#" mat-button>Align center</a>
        <a href="#" mat-button>Align center</a>
        <a href="#" mat-button>Align right</a>
        <a href="#" mat-button>Align right</a>
      </div>
    </mat-toolbar-row>
  </mat-toolbar>

菜单

你在找这样的东西吗

---

css。这将扩展以占用最大可用空间

.flexExpand {
    flex: 1 1 auto;
}

在模板中，使用flexExpand实用程序分隔项目

<mat-toolbar>
<mat-toolbar-row>
 <div >
      <a mat-button [routerLink]="'/accounts'"> Accounts </a>
      <a mat-button [routerLink]="'/create-account'"> Create Account </a>
    </div>
    <span class="flexExpand"></span>
    <div >
      <a mat-button [routerLink]="'/logout'"> Logout </a>
    </div>
    <mat-toolbar-row>
</mat-toolbar>

账户
创建帐户
注销

完美，正是我所需要的，非常感谢much@PaulTh.Yeaah太好了DOnly这对我有用！