Material2 - 当显示flex中的父项时，分页未显示在选项卡上

Question

我已经在他们的GitHub页面上打开了一个错误，但同时有人已经找到了解决方法吗？ https://github.com/angular/material2/issues/8788

使用“材质2”选项卡时，在其显示属性设置为flex的父容器中，不会显示选项卡上的分页控件。 （标签必须足以强制显示分页）

我想做的是：

<div class="in-flex">
    <mat-card>Simple card</mat-card>
    <mat-tab-group>
        <mat-tab label="Tab">Content</mat-tab>
        <mat-tab label="Tab">Content</mat-tab>
        <mat-tab label="Tab">Content</mat-tab>
        <mat-tab label="Tab">Content</mat-tab>
        <mat-tab label="Tab">Content</mat-tab>
        <mat-tab label="Tab">Content</mat-tab>
        <mat-tab label="Tab">Content</mat-tab>
        <mat-tab label="Tab">Content</mat-tab>
        <mat-tab label="Tab">Content</mat-tab>
        <mat-tab label="Tab">Content</mat-tab>
        <mat-tab label="Tab">Content</mat-tab>
        <mat-tab label="Tab">Content</mat-tab>
        <mat-tab label="Tab">Content</mat-tab>
        <mat-tab label="Tab">Content</mat-tab>
        <mat-tab label="Tab">Content</mat-tab>
        <mat-tab label="Tab">Content</mat-tab>
        <mat-tab label="Tab">Content</mat-tab>
        <mat-tab label="Tab">Content</mat-tab>
        <mat-tab label="Tab">Content</mat-tab>
        <mat-tab label="Tab">Content</mat-tab>
        <mat-tab label="Tab">Content</mat-tab>
        <mat-tab label="Tab">Content</mat-tab>
    </mat-tab-group>
</div>

风格

.in-flex {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

我不能给孩子任何宽度，无论是百分比还是其他，我需要让他们完全响应并以像flex这样的方式管理。有什么建议吗？

Answer 1

临时解决方案：
它可能会帮助你。
在css中添加断点媒体查询。

@media only screen and (max-width: 1279px) {
   .in-flex{
     display: block !important;
   }
}