在jQuery Dialog的右侧显示关闭按钮

我在这个Demo中创建了一个jQuery Dialog 。它运作正常。关闭按钮显示在右侧。但在我的网站上，在localhost上运行，关闭按钮显示在左侧，如下图所示。

jQuery对话框

我怎么解决这个问题？

关闭按钮样式

您的示例文件和jsFiddle演示之间的区别在于jsFiddle包含一个jQueryUI主题，它将一些CSS规则添加到。

通过向您的演示添加任何jQueryUI主题，它可以解决问题。例如，包括：

添加风格：

 .ui-dialog .ui-dialog-titlebar-close { position: absolute; right: .3em; top: 50%; width: 21px; margin: -10px 0 0 0; padding: 1px; height: 20px; }

其中包括position: absolute 。没有position ， right: 0我在另一个问题中添加的right: 0 隐藏标题栏和jQuery对话框中的显示关闭按钮没有效果，这解释了为什么按钮出现在左边，因为这是自然出现在正常流程中的位置 。

因此，如果您不使用jQueryUI主题，则需要将position: absolute添加到关闭按钮的规则中，如下所示：

 .ui-dialog .ui-dialog-titlebar-close { position: absolute; right: 0; }

一种可能性 – 风格是相互矛盾的。检查html和CSS文件中的left:或right: 🙂 CSS属性。我觉得这个class的风格 –

.ui-dialog .ui-dialog-titlebar-close

是冲突的。

编辑：

这是你需要改变的css 🙂