浮动太远了

Question

我有一个记录管理Web应用程序,它在一个屏幕上显示一个主记录,AJAXes动态构建编辑器到一个编辑器div,我用JQuery来制作可拖动的.这样可行.

即使div不是一个窗口,我认为让它更像一个窗口可能是一个好主意,所以我用"关闭"按钮进行编码.结构如下所示:

<div id="editor">
  <div id="draghandle" />
  <div id="closebutton" />
  <div id="editorbody" />
</div>

Editorbody是可变维度的,取决于人们想要进入的内容.

Draghandle的宽度设置为编辑器的100%.Closebutton在CSS中设置为float:right.

我的问题是,在IE6和IE7中,关闭按钮浮动得太远了.它总是在窗口的右边缘,无论我在哪里拖动编辑器div.在Firefox和Safari中,它看起来像我预期的那样 - 窗口和编辑器一样宽,而按钮位于右上角.

我并不特别喜欢浮动:对,只是想找到一种方法来设置CSS,它会在所有浏览器中给出相同的结果.有任何想法吗？

"屏幕截图"

这是我想在jsbin上做的一个模型(谢谢,redsquare)

示例代码

我正在使用法律敏感信息,因此我无法提供该应用的屏幕截图.但是,我拍摄了一些照片并屏蔽了文本和界面,只留下了窗口结构.

它在IE7中看起来如何

它在firefox 3中的外观如何

Answer 1

为了记录,解决这个问题的方法是改变关闭按钮的CSS

float: right;

至

position: absolute;
right: 5px;
text-align: right;

这在IE中产生了适当的结果,并且对于内部表单字段有一点填充,不用担心重叠.