How do i force a MatDialog to display my fields vertically in a column

I have a pop-up dialog to edit rows from a table. I would like the fields to be displayed in a column. At the moment they display either next to each other or a combination of vertical and horizontal depending on how I set the width property. e.g.

this.dialog.open(DialogBoxComponent, {
  width: '500px',

This doesn't always work depending on the length of the data.

How do I set the fields to always display vertically?

Creation code:

openDialog(action, obj) {
    obj.action = action;
    const dialogRef = this.dialog.open(DialogBoxComponent, {
    data: obj
});

DialogBoxComponent.ts

import { Component, Inject, Optional } from '@angular/core';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';

export interface UsersData {
  name: string;
  id: number;
  address: string;
  email: string;
  phoneNumber: string;
  dateOfBirth: string
}


@Component({
  selector: 'app-dialog-box',
  templateUrl: './dialog-box.component.html',
  styleUrls: ['./dialog-box.component.scss']
})
export class DialogBoxComponent {

  action: string;
  local_data: any;

  constructor(
    public dialogRef: MatDialogRef<DialogBoxComponent>,
    @Optional() @Inject(MAT_DIALOG_DATA) public data: UsersData) {
    console.log(data);
    this.local_data = { ...data };
    this.action = this.local_data.action;
  }

  doAction() {
    this.dialogRef.close({ event: this.action, data: this.local_data });
  }

  closeDialog() {
    this.dialogRef.close({ event: 'Cancel' });
  }

}

DialogBoxComponent.html

<h1 mat-dialog-title><strong>{{action}}</strong></h1>
<div mat-dialog-content>

  <mat-form-field *ngIf="action != 'Delete'; else elseTemplate">
    <input matInput
           placeholder="Name"
           [(ngModel)]="local_data.name">
  </mat-form-field>

  <mat-form-field *ngIf="action != 'Delete';">
    <input matInput
           placeholder="Address"
           [(ngModel)]="local_data.address">
  </mat-form-field>

  <mat-form-field *ngIf="action != 'Delete';">
    <input matInput
           placeholder="e-mail"
           [(ngModel)]="local_data.email">
  </mat-form-field>

  <mat-form-field *ngIf="action != 'Delete';">
    <input matInput
           placeholder="Phone"
           [(ngModel)]="local_data.phoneNumber">
  </mat-form-field>

  <mat-form-field *ngIf="action != 'Delete';">
    <input matInput
           placeholder="Date of Birth"
           [(ngModel)]="local_data.dateOfBirth">
  </mat-form-field>

  <ng-template #elseTemplate>
    Delete cannot be undone. <b>{{local_data.name}}</b>?
  </ng-template>

</div>
<div mat-dialog-actions>
  <button mat-button (click)="doAction()">{{action}}</button>
  <button mat-button (click)="closeDialog()" mat-flat-button color="warn">Cancel</button>
</div>