search

DevCloudFE / ng-devui

Angular UI Component Library based on DevUI Design
https://devui.design
MIT License
1.75k stars 210 forks source link

tabs 在flex中无法自适应宽度，页面被撑开 #252

Closed opxdo closed 2 years ago

opxdo commented 2 years ago 
<div style="display:flex;">
  <div style="flex:1">
    <d-tabs [type]="'wrapped'" [scrollMode]="true" [(activeTab)]="tabActiveId">
      <d-tab *ngFor="let item of tabItems" [id]="item.id" [title]="item.title">
      </d-tab>
    </d-tabs>
  </div>
</div>

图片

opxdo commented 2 years ago

加个overflow:hidden就可以了。

<div style="display:flex;">
<div style="flex:1; overflow:hidden;">
  <d-tabs [type]="'wrapped'" [scrollMode]="true" [(activeTab)]="tabActiveId">
    <d-tab *ngFor="let item of tabItems" [id]="item.id" [title]="item.title">
    </d-tab>
  </d-tabs>
</div>
</div>