.example-container { display: flex; flex-direction: column; } .example-container > * { width: 100%; } .wrapper { position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); } :host { display: flex; justify-content: center; } .mat-form-field { width: 100%; min-width: 300px; } mat-card-title, mat-card-content { display: flex; justify-content: center; text-align: center; align-items: center; } .error { padding: 16px; width: 300px; color: white; background-color: red; } .button { display: flex; justify-content: flex-end; }