更改材料2选项卡宽度而不影响父组件中的选项卡？

Question

我在每个有标签的视图上都有一个子搜索组件。由于这些选项卡在选项卡标签中只有图标，因此我必须将它们设置为具有较小的宽度。 我发现了一些有用的东西：

/deep/ .mat-tab-label {
  min-width: 80px !important;
}

但是，这也会影响父组件中的选项卡，但如果没有/deep/和!important标签，则不会更改其宽度。 我尝试过使用所有形式的ViewEncapsulation，但没有一个能完成任务。

标签结构基本上是这样的：

    <md-tab-group [selectedIndex]="selectedTabIndex">
            <md-tab>
              <ng-template md-tab-label><i class="fa fa-users"></i> {{'common_users' |
                translate | capitalize}}
              </ng-template>
              <search-component></search-component>
            </md-tab>
    </md-tab-group>

搜索组件中还有标签：

<md-tab-group>
  <md-tab>
    <template md-tab-label>
      <i class="fa fa-search" mdTooltip="{{'common_simplesearch' | translate | capitalize}}"></i>
    </template>
    <div fxLayout="column">
      <form>
        <md-input-container
          *ngFor="let option of simpleSearchOptions; let i = index; let last = last" fxFlex="100%"
          style="margin-right: 10px; margin-top: 5px;">
          <input mdInput
                 type="text"
                 [(ngModel)]="option.value"
                 name="searchQuery{{i}}">
        </md-input-container>
        <div fxlayout="row">
          <button md-raised-button mdTooltip="{{'common_search' | translate | capitalize}}" color="primary"
                  type="submit"
                  (keypress)="onEnter($event, searchSet)"
                  (click)="search(searchSet)">
            {{'common_search' | translate | capitalize}}
          </button>
          <button *ngIf="canClear != false" md-raised-button mdTooltip="{{'common_clearSearch' | translate |
      capitalize}}" (click)="clearSearch()"><i class="fa fa-eraser"></i>
          </button>
        </div>
      </form>
    </div>
  </md-tab>
  <md-tab>
    <template md-tab-label>
      <i class="fa fa-search-plus" mdTooltip="{{'common_advancedsearch' | translate | capitalize}}"></i>
    </template>
    <div fxlayout="column">
      <form (ngSubmit)="search(searchSet)">
        <div *ngFor="let searchItem of searchSet.searchItems; let i = index; let first = first; let last = last">
          <md-select [ngModel]="searchItemType[i]"
                     (change)="onSearchTypeChange(searchItem, i)"
                     name="searchBy{{i}}" fxFlex="100">
            <md-option [value]="stringify(option)" *ngFor="let option of searchOptions">{{option.display | translate |
              capitalize}}
            </md-option>
          </md-select>
          <div *ngIf="searchBy == 'identifier'">
            <md-select [(ngModel)]="searchItem.key" name="idType" fxFlex="100">
              <md-option *ngFor="let option of tokenSearchOptions" [value]="option">{{option | translate | capitalize}}
              </md-option>
            </md-select>
          </div>
          <md-select [(ngModel)]="searchItem.modifier" name="searchType{{i}}" fxFlex>
            <md-option [value]="modifier.value" *ngFor="let modifier of searchModifiers[i]; let i = index">
              {{modifier.display | translate |
              capitalize}}
            </md-option>
          </md-select>
          <md-input-container fxFlex="100">
            <input mdInput
                   type="text"
                   placeholder="{{'common_search' | translate | capitalize}}"
                   [(ngModel)]="searchItem.value"
                   name="searchQuery{{i}}">
          </md-input-container>
          <a class="btn btn-alert btn-lg" (click)="addSearchItem()" [hidden]="!last">
            <i class="ion-ios-plus-outline"></i>
          </a>
          <a class="btn btn-alert btn-lg" (click)="removeSearchItem(searchItem)" [hidden]="first || !last"><i
            class="ion-ios-minus-outline"></i></a>
        </div>
        <button md-raised-button color="primary"
                [disabled]="!searchSet.searchItems[0].key || !searchSet.searchItems[0].modifier || !searchSet.searchItems[0].value"
                (keypress)="onEnter($event, searchSet)" (click)="search(searchSet)">{{'common_search' |
          translate
          | capitalize}}
        </button>
        <button md-raised-button (click)="clearSearch()">{{'common_clearSearch' | translate |
          capitalize}}
        </button>
      </form>
    </div>
  </md-tab>
  <md-tab>
    <template md-tab-label>
      <i class="fa fa-bookmark-o"></i>
    </template>
    Saved searches
  </md-tab>
</md-tab-group>

如何仅在子组件中设置选项卡样式而不影响父组件？