动态选择插件下拉列表中的CSS对齐问题

Question

Example Fiddle

我已使用选择插件进行多选下拉菜单。

在初始页面上，dropdown视图中已添加html chosen。

然后，如果我们点击“add mitigator”，则会添加新的下拉列表。

现在功能如下：

• 每个下拉列表都有1到14个选项

• 如果我从下拉列表1中选择一个选项（比如2），那么其他两个下拉列表将从其选项菜单中取消选择（禁用）。

问题围绕下拉列表所在的div的CSS问题。

产生问题：

• 访问小提琴链接。

• 点击“add mitigator”链接再添加两个下拉列表。

• 在dropdown 2中，逐个选择所有选项，您会看到dropdown2被扩展并隐藏在dropdown3后面。但dropdown1不会发生这种情况。

如何理清这个问题？

Answer 1

尝试关注CSS

.chosen-container {
  min-height:30px;
  height:auto !important;
}

新添加的多个选择下拉菜单中有一个div，其classname .chosen-container通过JavaScript将高度30px应用到元素样式中。

您需要从css文件覆盖该CSS属性。

我更新了你的小提琴：https://jsfiddle.net/vrwzckav/4/