Question

我是bootstrap框架的新手，我正在处理一个输入表单，该表单应根据过去的浏览历史记录填充自动完成列表。我已经测试了IE和Chrome上的所有内容，并且自动完成框直接排列在输入框的下方，但是，在FF 31中（在Windows 7平台上 - 2个显示器上），自动完成框显示在我的第二个显示器上。

有人告诉我这可能是一个2监视器问题。

有人还告诉我这是FF浏览器问题。另一个说它是一个Bootstrap的东西。

我做了一些研究，发现其他人建议Z指数和位置：绝对

如果有人遇到过类似问题，我将不胜感激。

感谢您的时间 - Rich

Answer 1

我遇到了一个非常类似的问题。我通过修改它在页面上的位置来修复它。

“translate”css属性在firefox中遇到问题。

似乎将自动完成框放在最初绘制元素的位置，而不是在应用css后最终放置的位置。就像我说的那样，我的问题非常相似，可能会导致你的解决方案。

翻译打破它：

div{
    position: absolute;
    top: 50px;
    transform: translate(30%);
    width:100%;
}

删除翻译并更改其定位方式：

div{
    text-align:center;
    position: absolute;
    top: 25px;
    left:30%;
}