Angular 5材质的DatePicker布局拥挤了几个月

Question

我在角度5中使用了mat-datepicker来获取输入日期。但是，当压光机打开时，几个月的布局是奇怪的（内容变得拥挤）。其他月份看起来还不错。

我也已在我的styles.css中导入了indigo-pink.css

html代码：

<tr style="width:50%">
                <td>
                  <span class="cellLabel">Choose a Date for Installation:</span>
                </td>
                <td>
                  <span class="cellLabelMand">
                    <mat-form-field>
                      <input matInput [matDatepicker]="picker" [(ngModel)]="date" placeholder="Choose a date">
                      <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
                      <mat-datepicker #picker></mat-datepicker>
                    </mat-form-field>
                  </span>
                </td>
              </tr>

app.module.ts具有以下导入：

import {MatDatepickerModule, MatNativeDateModule, MatInputModule, MatFormFieldModule} from '@angular/material';
these modules are also added to imports and exports

几个月内布局不会变得拥挤。请帮我修复它。

Answer 1

我自己修复了。希望对您有所帮助。检查表单元格中是否使用日期选择器真的很重要。在表行或单元格上已经应用的css可能会影响它，因此很难找到解决方案。在这种情况下，我已经在表格单元格上应用了50％的宽度，这导致了问题。