appendChild附加到IE中元素的右侧

Question

我动态地将div附加到另一个动态创建的div。在IE中，它显示在元素的右侧，但在所有其他浏览器中显示在元素的底部。我希望它显示在底部，就像在FF和Chrome中一样。有什么建议吗？

自动完成适用于：[ "#Saab", "#Volvo", "#BMW", "#Mini", "#MiniMonster" ]

IE

非IE

解决：  我正在使用divEl.setAttribute("style", "top:" + top + "px; left:" + left + "px; width:" + width + "px;");

IE在setAttribute方面存在问题。所以我转到：

divEl.style.top = top + "px";
divEl.style.width = width + "px";
divEl.style.left = left + "px";

Answer 1

我会在你的情况下使用relative定位，因为绝对定位总会受到窗口大小和其他因素的影响，甚至从你的jsFiddle也可以看出它出现在错误的位置（使用Chrome） 。 所以，我将CSS更改为：

#matches_tooltip {
    position: relative;
    top: 0;
    left: 0;
    display: none;
    background-color: #FFFFFF;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    border-color: #E0E0E0;
    border-width: 1px;
    cursor: pointer;
    text-align: left;
}

http://jsfiddle.net/ruslans/9Hg8a/2/

我无法在IE中测试，但在所有浏览器中都应该可以。请注意，我已经修改了您的javascript而不是设置位置属性。

Answer 2

试试这个

.options_text {
  position: relative;
  text-align: center;
}

并将您的javascript渲染修改为：

element.style {
  bottom: -26px;
  display: inline;
  left: 12px;
  visibility: visible;
  width: 286px;
}