Question

我目前正在使用Jquery resizable（http://api.jqueryui.com/resizable/）

我注意到它与“box-sizing：border-box;”无法正常工作。

我用google搜索它并且无法得到可靠的答案..（也许我没有花足够的时间......）

有人已经在js小提琴上发布了一个与我的问题完全相同的问题的例子：

(http://jsfiddle.net/muNjL/)

我不确定这个问题的解决方案是否已经解决......

如果我别无选择但不使用边框，请告诉我。我将非常感激。

感谢您阅读和快乐编码！

-Danny C

Answer 1

你为什么要border-box一切？正常化？

在左侧的小提琴选项下尝试JSFiddle的Normalize CSS。我假设它加载normalize.css。然后删除所有边框声明。您的可调整大小现在应该展开to the entire width and height of the parent container。

#container {
    width: 300px;
    height: 300px;
    background: #888;
}

#container #ohboxme {
    background: #FFF;
    border: 1px solid grey;
    padding: 10px;
    width: 200px;
    height: 100px;
    font-size: 10px;
}

Answer 2

这是jqueryui可调整大小的已知错误...请参阅http://bugs.jqueryui.com/ticket/8932 现在最好的解决方案是切换到使用css＆＃39; outline＆＃39;而不是＆＃39; border＆＃39;。基本上，如果你设置一个边框，那么它会改变jquery的width（）函数返回的值。这意味着可调整大小的小部件认为该框比实际小。

Jquery UI可调整大小与框大小：＆＃34; border-box＆＃34;问题

2 个答案: