css - 更改下拉列表的表单控件填充和下拉列表不显示任何选项

Question

我正在使用 ASP.NET MVC 构建 Web 应用程序。我更改了表单控件类的填充，但下拉列表未显示任何选项。

填充最初设置为:

.form-control {
    padding: 6px 15px;
}

通过上面的设置，我可以在文本框中看到选项

现在我想让我的文本框和下拉列表更大。所以我将填充更改为:

.form-control {
    padding: 20px 15px;
}

现在我在下拉列表中看不到任何选项。当我将上下填充从 6px 增加到 20px 时，我可以看到该选项正在从 View 中消失。我该如何解决这个问题？

Answer 1

默认情况下， Bootstrap 表单控件的高度固定为 34px。尝试将高度设置为“继承”，这样它会取消 34px 设置。

.form-control {
    padding: 20px 15px;
    height: inherit;
}