Opened 6 years ago

Closed 6 years ago

#8960 closed bug (duplicate)

Resizable shrinks a little on start of resize if border-box CSS used

Reported by: stevegrove Owned by:
Priority: minor Milestone: 1.10.0
Component: ui.resizable Version: 1.9.2
Keywords: Cc:
Blocked by: Blocking:

Description

This has been raised several times before and closed as not reproducible - so I have included a JSFiddle (http://jsfiddle.net/aF9HX/3/) that shows the problem occurs when you have "box-sizing: border-box;" and its browser specific variants enabled in your CSS.

This was the original bug report I found which in teh comments mentions that the border-box might be the reason:

http://bugs.jqueryui.com/ticket/4152

And a later one concerning the same problem:

http://bugs.jqueryui.com/ticket/5231

Which was rejected due to this fiddle:

http://jsfiddle.net/tj_vantoll/aF9HX/.

So using the above knowledge the following JSFiddle (derived from the above) shows the problem - when you start to resize the div (or whatever) shrinks a fraction which is very annoying and especially so when grid is turned on. The only difference between the fiddles is the extra CSS to turn on the boorder-box and a grid option on the resizable (not necessary for the problem but highlights its impact)

http://jsfiddle.net/aF9HX/3/

Change History (1)

comment:1 Changed 6 years ago by tj.vantoll

Resolution: duplicate
Status: newclosed

Duplicate of #8932.
Hi stevegrove,

Thanks for taking the time to contribute to the jQuery UI project. I verified and reduced your test case - http://jsfiddle.net/gcBU6/. This is the same issue as #8932 but I'm going to expand that issue to include the border per your test case. Change border to outline and you can see that the example works as expected.

Note: See TracTickets for help on using tickets.