Html 垂直对齐垫复选框和垫形式字段|角度材料|角度

我试图实现文本字段和复选框并排。像这样的。

但是，问题是

和

没有垂直对齐。 如何通过垂直对齐这两个方向来前进

代码如下：

<mat-card>
    <mat-card-title>
        Family Information
    </mat-card-title>
    <form [formGroup]="familyInfo">
        <div fxLayout="row" fxLayoutAlign="flex-start" fxLayoutGap="40px">
            <mat-form-field fxFlex="10%">
                <mat-label>Contact Name</mat-label>
                <input matInput>
            </mat-form-field>
            <mat-form-field fxFlex="10%">
                <mat-label>Relation Type </mat-label>
                <mat-select>
                    <mat-option *ngFor="let relationType of relationTypes" [value]="relationType" color="accent">
                        {{relationType}}
                    </mat-option>
                </mat-select>
            </mat-form-field>
            <mat-form-field fxFlex="10%">
                <mat-label>Gender </mat-label>
                <mat-select>
                    <mat-option *ngFor="let gender of genders" [value]="gender" color="accent">
                        {{gender}}
                    </mat-option>
                </mat-select>
            </mat-form-field>
            <mat-form-field fxFlex="10%">
                <mat-label>Date Of Birth</mat-label>
                <input matInput [matDatepicker]="dateOfBirth" formControlName="dateOfBirth">
                <mat-datepicker-toggle matSuffix [for]="dateOfBirth"></mat-datepicker-toggle>
                <mat-datepicker #dateOfBirth></mat-datepicker>
            </mat-form-field>

            <mat-checkbox formControlName="isDependent">Is Dependent</mat-checkbox>

            <div fxFlex="100%"></div>
            <mat-card-actions>
                <button mat-raised-button color="primary" type="submit" class="align-right-button">
                    Save
                </button>
            </mat-card-actions>
        </div>

家庭信息
联系人姓名
关系类型
{{relationType}}
性别
{{性别}
出生日期
依赖
拯救

---

我试着使用

，但根据角度材料文档<代码>不能是

的一部分，必须手动定位复选框。没有其他方法来排列元素。类似于

align self:center

for mat复选框

请注意，

mat form field

有一些自定义填充/边距。因此，为了获得完美的安装，您需要检查元件并在顶部添加一对px。根据字体大小，它会有所不同

---

希望这会有所帮助。祝你好运

你能用你的css复制一下吗？