Jquery UI 按钮定位

Question

我使用的是 jquery UI 1.8 - 我通过使用 element.button() 方法将按钮功能应用到我的 html 按钮元素。

现在一切正常，直到我在按钮元素上方动态添加另一个元素。这些按钮保持在原位，就好像它们是绝对位置一样。但这种情况只发生在 IE8/IE9 中。当您“将鼠标悬停在”它们上时，它们会纠正其位置。有没有解决的办法？

非常感谢

添加代码:

这是我正在使用的表。我之前尝试过使用两个 float div，但尝试使用表格来确保我的 css 不会导致问题:

 <table style="width:400px">
 <tr><td class="subheader">Aufgaben</td>
 <td style="text-align: right">
 <button class="versions">Historie</button></td>
 </tr></table>

现在我调用按钮方法

$( ".versions" ).button({
     icons: {
         primary: "ui-icon-calendar"
     }
});

这就是我在按钮上方添加元素的方法，实际上我只是将元素从 display: none 设置为 display: block

 $(".ui-state-highlight").css("display", "block");

现在的结果正如我之前所描述的，按钮元素位于相同的位置，而其他所有元素则将其位置进一步向下移动到页面。

Answer 1

这将与 jQuery ui 调用的 css 样式有关，如果您还没有准备好这些样式，请确保您已准备好，因为它们都将被测试!

这就是我要做的:

<div id="container" style="float: left; width: 100%">
<div id="left" style="float: left; width: 40%">
    <p style="width: 100%; height: 30px display: block"><a href="#" style="displaY: block">Button 1</a></p><!-- change to suit -->
</div>
<div id="right" style="float: left; width: 40%;">
    <p style="width: 100%; height: 30px; display: block"><a href="#" style="displaY: block">Button 2</a></p>
</div>

然后调用您的 ui 按钮 - 这只是您如何编码和设计样式的问题!