防止离子徽章崩溃和隐藏信息

Question

我在同一行上有很多离子徽章。每个徽章都包含一个离子图标和一些文本。当同一行上有很多离子徽章时，为了显示所有离子徽章而不会显示文本。

以下是HTML（可以有更多的离子徽章）：

<ion-item>
    <ion-badge slot="end" color="light">
        <ion-icon src="theSourceHere.svg"></ion-icon>
        Text
    </ion-badge>
    <ion-badge slot="end" color="light">
        <ion-icon src="theSourceHere.svg"></ion-icon>
        Text
    </ion-badge>
</ion-item>

除了ionic框架中的CSS或SCSS，我没有应用CSS或SCSS，这里是result。我已经看过CSS一段时间了，但目前还没有发现任何东西。

我正在尝试允许溢出-y，以便用户只需要滚动浏览徽章即可。

Answer 1

关闭<ion-item>标签并检查是否有效

希望这就是你expecting 使用ion-scroll和direction属性。