.draggable（）不与Firefox的弹性框合作

Question

我构建了一个简单的jsfiddle来演示我的问题：http://jsfiddle.net/9MD43/

调整Chrome上的框大小会使框保持绿色，这就是我想要的。尝试在Firefox上调整框的大小会导致框变为红色，因为弹性框缩小为空。 Internet Explorer 10的行为与Chrome一样，并使框保持绿色（此示例中未显示）。

通过从脚本中删除.draggable命令可以缓解此问题：

$("#outer").resizable().draggable(); // <-- removing .draggable() will keep the box green in Firefox after resizing

标记很简单，没什么特别的：

<div id="outer">
    <div id="content">
        <div id="list">
        </div>
    </div>
</div>

“＃outer”是弹性框，“＃content”的弹性为1。

“＃content”以相对位置定位，“＃list”位于其中。在我的应用程序的完整版本中，我动态地将项目添加到“#list”div并且已经应用​​了overflow：scroll，这就是为什么CSS对于这个简单的例子来说似乎不寻常。

这是jquery的.draggable和/或Firefox中的错误吗？这个问题有一个干净的解决方法吗？

[edit]一个更简单的例子：http://jsfiddle.net/LXmuL/

调整框的大小会在Firefox上折叠弹性，但不会在Chrome上折叠。这可以通过盒子的背景颜色来观察。

Answer 1

我发现了这个错误。

jquery为可拖动元素添加了绝对定位。 Firefox有一个长期存在的灵活盒和绝对定位错误： https://bugzilla.mozilla.org/show_bug.cgi?id=579776 。实际上，将外框的位置设置为绝对足以折叠我示例中的弹性框。