我的Angular Material Datepicker有问题。我将其放置在网站上的单元格间距为0的表中。我的问题是,除了Datepicker之外,每个输入字段都很好且长度相等,但Datepicker比其他任何输入字段都长一点。有人知道为什么以及如何解决吗?我从网站添加了HTML和CSS!
.full-width {
width: 100%;
}
mat-label, input, mat-checkbox {
font-size: 16px;
}
<mat-card class="example-card">
<h2>Persönliche Daten:</h2>
<form [formGroup]="this.formService.anmeldung">
<div *ngIf="!deviceXs">
<table cellspacing="0" class="full-width">
<tr>
<td>
<mat-form-field class="full-width">
<mat-label>Vorname</mat-label>
<input formControlName="vorname" matInput>
</mat-form-field>
</td>
<td>
<mat-form-field class="full-width">
<mat-label>Nachname</mat-label>
<input formControlName="nachname" matInput>
</mat-form-field>
</td>
</tr>
</table>
<table cellspacing="0" class="full-width">
<tr>
<td>
<mat-form-field class="full-width">
<mat-label>Geburtstag</mat-label>
<input matInput [matDatepicker]="picker" formControlName="geburtstag">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker startView="multi-year" #picker></mat-datepicker>
</mat-form-field>
</td>
<td>
<mat-form-field class="full-width">
<mat-label>Geburtsort</mat-label>
<input formControlName="geburtsort" matInput>
</mat-form-field>
</td>
</tr>
</table>
<table cellspacing="0" class="full-width">
<tr>
<td>
<mat-form-field class="full-width">
<mat-label>Straße</mat-label>
<input formControlName="strasse" matInput>
</mat-form-field>
</td>
<td>
<mat-form-field class="full-width">
<mat-label>Hausnummer</mat-label>
<input formControlName="hausNr" matInput>
</mat-form-field>
</td>
</tr>
</table>
<table cellspacing="0" class="full-width">
<tr>
<td>
<mat-form-field class="full-width">
<mat-label>PLZ</mat-label>
<input formControlName="plz" matInput>
</mat-form-field>
</td>
<td>
<mat-form-field class="full-width">
<mat-label>Ort</mat-label>
<input formControlName="ort" matInput>
</mat-form-field>
</td>
</tr>
</table>
</div>