css - 推特 bootstrap typeahead 下拉菜单

Question

您好，我正在使用 Twitter Bootstrap 。我在我的模型窗口中使用了 typeahead。我的问题是，当我在文本框中输入时，下拉菜单非常完美，但它位于文本框的最底部。我观察到下拉菜单出现时设置了属性 top 。但我不知道如何在运行时更改它。

这是图片:

我不擅长 CSS。谁能告诉我应该怎么做才能解决这个问题？

Answer 1

您需要在 bootstrap 中覆盖 typeahead 类的一些默认样式。具体来说，我可以通过将 position 设置为 relative 并将 z-index 设置为 10000 来使其正确显示。position 属性要求您使用 !important 声明。

.typeahead {
    position:relative !important;
    z-index:10000;
}​

在 http://jsfiddle.net/technotarek/Msttw/ 查看我的工作 fiddle .

请注意，我的预输入值是彩虹的颜色，以防您无法触发它。

此外，根据您的确切表单布局，您可能需要使用顶部/底部或左侧/右侧 CSS 属性根据您自己的情况调整 typeahead 元素的位置。