浮动太远了！ [英] Floating Too Far Right!

问题描述

我有一个记录管理Web应用程序，它在一个屏幕上显示主记录，AJAXes动态编辑编辑器到编辑器div，我使用JQuery来做拖拽。

I've got a record management web application which displays a master record on one screen and AJAXes dynamically built editors into an editor div, which I've used JQuery to make draggable. That works.

即使div不是一个窗口，我认为这可能是一个好主意，使它的行为有点像一个，所以我编码一个关闭按钮。结构如下：

Even though the div isn't a window, I thought it might be a nice idea to make it act a bit more like one, so I coded in a "close" button. The structure looks like this:

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

Editorbody是可变维度，取决于用户尝试输入的内容。

Editorbody is variable-dimension depending on what people are trying to enter.

Draghandle的宽度设置为编辑器的100％。关闭按钮在CSS中设置为float：right。

Draghandle's width is set at 100% of editor. Closebutton is set up in CSS as float:right.

我的问题是，在IE6和IE7中，关闭按钮漂浮得太多。它总是反对窗口的右边缘，无论我在哪里拖动编辑器div。在Firefox和Safari中，它看起来像我预期的 - 窗口与编辑器和关闭按钮坐在右上角一样宽。

My problem is that, in IE6 and IE7, the close button floats too far right. It's always against the right edge of the window, no matter where I drag the editor div around to. In Firefox and Safari it looks like I expected it to - the window is as wide as editorbody and closebutton sits in the top right corner.

我不是特别附加float：right，只是寻找一种方式来设置CSS，它将给我在所有浏览器中的相同结果。任何想法？

I'm not particularly attached to float:right, just looking for a way to set up the CSS that'll give me the same result across all browsers. Any ideas?

这里是一个我想在jsbin感谢，redsquare）

Here's a mockup of what I'd like to do on jsbin (thanks, redsquare)

示例代码

我使用的是法律上的敏感信息，因此我无法提供应用程序的屏幕截图。然而，我已经拍摄了一些照片，并阻止了文本和界面，只留下窗口结构。

I'm working with legally sensitive information so I can't provide screenshots of the app. I have, however, taken some shots and blocked out the text and interface, leaving only the window structure.

它在IE7中的外观

how it looks in firefox 3

推荐答案

您可以考虑使用 JQuery对话框，因为它的预制和样式已经工作跨平台。

You may want to consider just using a JQuery Dialog instead since its premade and the styles already work cross platform.

这篇关于浮动太远了！的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！