在模态（Materializecss）内部时选择隐藏的下拉列表答案

【问题标题】：Select dropdown list obscured when inside Modal (Materializecss)在模态（Materializecss）内部时选择隐藏的下拉列表
【发布时间】：2020-05-24 10:58:52
【问题描述】：

这是一个特定于Materializecss 框架的问题，以及其中的两个组件，即Modal 和Select。当模态框内的 Select 输入具有较长的选项列表 (9+) 时，选项列表会流出模态容器，切断列表的顶部，因此用户实际上无法看到所有选项。当它位于具有固定/最大高度的容器内时，处理长选项列表的最佳方法是什么？

【问题讨论】：

你特别需要显示显示这个模态的CSS/HTML代码，否则我们只能猜测这里发生了什么。请加倍努力。但是，如果您使用 FLEXBOX CSS 和 'justify-content: center'（或任何其他 FBL 属性 'center'ing）来定位与 'overflow: hidden' 相结合的内容，则内容可能会移出视线......注意这我自己有时。不记得具体的了。

标签： css select modal-dialog dropdown materialize

【解决方案1】：

您可以指定最大高度，并且可以通过滚动来管理溢出。我假设您的下拉菜单类在我的答案中是下拉菜单，您可以将其调整为您的。

.dropdown-menu {
    max-height: 100px;
    overflow: scroll;
}

【讨论】：