Question

我使用jQuery UI和拖放插件创建了一个小小部件。现在，我发现了IE的一些问题。

可以在 - http://widget.adipa.com访问此小部件。在此URL，小部件适用于IE7 / 8。

但是当我将这个小部件嵌入到iframe中时，就像完成了here一样，它开始给出不对齐的区块。在下面的图像中，可以看到瓷砖放置在其间的白色空间很小 -

enter image description here

如图所示，在A和E之间，它有空格。

您可以在iframe here和iframe here中查看小部件。

重现错误的步骤 -

以上步骤适用于没有iframe的IE，也不适用于IE iframe小部件。

这是因为IE使用iframe和不使用iframe呈现不同的东西，或者它是否与jQuery有关。似乎jQuery在其中做了很多工作来支持IE。

感谢。

Answer 1

我已经测试了你的小部件，当你拖动一个字母然后放下它时，它看起来像是一个空白区域（即使在我测试过的IE9中）。

这是因为设置的doctype，这将导致IE以不同于其他浏览器的方式呈现空格。例如以下html：

<span style="border: 1px solid black">a </span>

（注意字母'a'后面的空格）。这将在IE中以不同方式呈现，例如Firefox自IE也提供了空间。但是，要使其消失，请更改文档的doctype;现在我认为我们应该使用HTML5（as mr Resig discuss）：

<!DOCTYPE html>

这将使浏览器处于标准模式，并使空间消失。

另一种可能性是编辑HTML并删除元素中的所有空格......糟透了，我知道:)

无论如何，希望这有帮助！