Angular 2 material mat-tab size

喜欢而已 提交于 2019-12-21 03:48:50

问题


I have the following piece of code

  <mat-tab-group>
    <div *ngFor="let question of subcategory.questions">
        <mat-tab label={{question.question_id}} class="question-tab">{{question.question}}</mat-tab>
    </div>
  </mat-tab-group>

which displays like:

However I want to reduce tabs width, like this:

The problem is, when I change css at run time, it adjusts fine, but when I put css like:

.mat-tab {
  min-width: 50px !important;
}
.mat-tab-label[_ngcontent-c9]{
    min-width: 50px !important;
}

It doesn't work. Any idea how to approach this ?


回答1:


Try this:

/deep/.mat-tab-label, /deep/.mat-tab-label-active{
 min-width: 0!important;
 padding: 3px!important;
 margin: 3px!important;
}

NOTE: In angular 8 /deep/ not working... you can use ::ng-deep



来源:https://stackoverflow.com/questions/44386840/angular-2-material-mat-tab-size

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!