下拉菜单在模态下打开 - CSS 问题答案

【问题标题】：Dropdown Opens Under Modal - CSS Issue下拉菜单在模态下打开 - CSS 问题
【发布时间】：2018-02-22 14:33:48
【问题描述】：

我有一个引导模式，里面有几个下拉菜单，因为我设置了很多东西 overflow: auto 所以它有滚动条（参见图片右侧的滚动条）。

现在的问题是，当我单击下拉菜单时，它会在模式下打开（见图）我需要下拉菜单才能在该模式下打开。

P.S：我搜索了很多解决方案，我们需要设置模态 CSS 属性 overflow: visible。但在我的情况下，我必须设置 overflow: auto 因为我在模式中有很多东西，滚动条是必要的，否则模式高度会超出页面。

需要一些 CSS 专家来解决这个问题。

模态 CSS

.modal {
  max-height: 250px;
  overflow: auto; 
}

下拉 CSS

ul.dropdown {
  z-index: 999999;
  position: relative;
  display: inline-block;
  vertical-align: middle;
}

 ul.dropdown li {
  top: 110%;
  padding: 0;
  max-width: 500px;
  max-height: 197px;
  position: absolute;
}

【问题讨论】：

我认为这是重复的。你能发布所有相关的代码吗？
@ZimSystem 我添加了更多代码

标签： html twitter-bootstrap css bootstrap-modal

【解决方案1】：

您好，您需要像这样为您的下拉菜单提供绝对位置

ul.dropdown {
  position: absolute;
  top: 110%;
  display: inline-block;
  vertical-align: middle;
}

对于 li 的孩子们：

ul.dropdown li {
  padding: 0;
  max-width: 500px;
  max-height: 197px;
}

【讨论】：