在 Bootstrap UI 中设置 Typeahead 下拉菜单的样式答案

【问题标题】：Styling the Typeahead drop down in Bootstrap UI在 Bootstrap UI 中设置 Typeahead 下拉菜单的样式
【发布时间】：2014-09-12 22:09:48
【问题描述】：

我正在开发一个使用 AngularJS 和 Bootstrap 的应用程序。为了提供帮助，我正在使用Bootstrap UI。在这个项目中，我使用了预输入控件。我正在尝试使出现在文本框下方的列表与文本框本身的宽度相同。无论。在这个时候，它总是在改变大小。但是，我不确定如何使建议框与文本框的宽度相同。目前，我正在尝试以下方法：

Here is my plunker

目前，我有以下内容，但无法正常工作。

.dropdown-menu {
  width:75%;
}

谁能帮我将建议列表的宽度设置为与文本框的宽度相同？

谢谢！

【问题讨论】：

你能尝试给出 min-width: 75% !important 并检查它是否有效吗？
我尝试添加!important。不幸的是，这不起作用。

标签： css angularjs twitter-bootstrap

【解决方案1】：

您可以使用 CSS3 calc() 动态计算 .dropdown-menu 的宽度。

.dropdown-menu{
   width: -moz-calc(100% - 28px);
   width: -webkit-calc(100% - 28px);
   width: calc(100% - 28px);
}

并从.dropdown-menu>li>a 中删除white-space: nowrap;。希望对你有帮助！

【讨论】：