具有滚动条的 div 无法识别溢出的内容答案

【问题标题】：The div which has scrollbar did not recognize overflowed content具有滚动条的 div 无法识别溢出的内容
【发布时间】：2021-09-08 19:04:47
【问题描述】：

我有一个使用 ion-tab 的应用程序。 ion-tab 工作正常，但是当 ion-tab-button 太多时，它会离开屏幕并且不可见。为了解决这个问题，我写了这样的代码；

<ion-tabs (ionTabsDidChange)="listen($event)">
      <div class="scrollable-div">
        <ion-tab-bar slot="bottom">
          <ion-tab-button
            *ngFor="let item of tabItems"
            [tab]="item.tab"
          >
            <ion-icon [name]="item.icon"></ion-icon>
            <ion-label>{{item.label}}</ion-label>
          </ion-tab-button>
        </ion-tab-bar>
      </div>
</ion-tabs>

scrollable-div 类：

.scrollable-div {
  padding: 4px;
  background-color: green;
  width: 100%;
  overflow-x: scroll;
  text-align: justify;
}

结果： Result of content

div(scrollable-div) 如何检测溢出的标签并激活（已显示但未激活）滚动条？

【问题讨论】：

看看。它与 hava 或 max-width css 样式接缝并溢出：隐藏。如果你可以应用overflow-x: 滚动到它，你可能根本不需要添加你的scrollable-div。
有效！非常感谢:)

标签： javascript html css angular ionic-framework

【解决方案1】：

看看<ion-tab-bar>。它似乎具有width 或max-width css 样式和overflow: hidden。如果您可以对其应用overflow-x: scroll，则可能根本不需要添加您的可滚动div。

【讨论】：