1

如果我使用包含 4* 的 div 构建一个 html 片段<input type="checkbox">并设置overflow-y: auto，max-height: 250px;我会得到没有滚动条的预期行为。但是，如果我用 Angular Material 中的复选框替换标准复选框，我会看到一个滚动条，我该如何删除它并保持上面的预期行为？

第一个列表是 Angular Material，第二个是标准 html 元素。

问题示例

示例 stackblitz -> https://stackblitz.com/edit/angular-69zuiy

4

2 回答 2

1

@Nico你的权利，但我们也可以通过其他方式解决它。如果您添加一些类似10px或更多的填充，那么您可以轻松解决它。

.wrapper {
    padding: 10px 5px;
}

这种情况造就了那些韵律风格....

.mat-checkbox .mat-checkbox-ripple {
    position: absolute;
    left: calc(50% - 20px);
    top: calc(50% - 20px);
    height: 40px;
    width: 40px;
    z-index: 1;
    pointer-events: none;

}
于 2019-04-04T13:10:59.680 回答
0

您使用哪种浏览器？例如，如果是 Firefox，那么滚动条就会出现一些问题。一种“解决方法”是将容器的内部宽度设置为大于父容器，然后通过将父容器设置为溢出隐藏来“剪切”滚动条。如果您希望它始终为 100% 大小，则可以将内部容器设置为 calc(100 + 20px)。在这种情况下，0px 是滚动条的宽度。希望这会帮助你。

于 2019-04-04T13:11:43.337 回答