Opened 3 years ago

#14908 new bug

Sortable truncates width property to an integer which makes flexbox items to wrap

Reported by: Peter Hozák Owned by:
Priority: minor Milestone: none
Component: ui.sortable Version: 1.11.3
Keywords: Cc:
Blocked by: Blocking:

Description

JQuery UI Sortable truncates width and height style properties of the currently dragged item.

If the original width/height stretches to fit the content to a floating point precision, e.g. when using flexbox (see https://www.w3.org/TR/css3-flexbox/#valdef-align-items-stretch), then the truncation forces the content to wrap.

Same behaviour observed in Firefox 43.0.4, Chrome 47.0.2526.111 and Edge 25.10586 on Win 10... using either jQuery UI 1.11.3, 1.11.4 or git version at the time of reporting.

Reproduction:

https://jsfiddle.net/Aprillion/Lbgjf61e/1/

Proposal:

If floating point precision is not possible, rounding up instead of down would prevent this problem.

Workaround:

A dirty fix I used for the immediate need was to manually edit the downloaded source code - https://github.com/jquery/jquery-ui/blob/cb69f0025f257c28ac3be39c4269373a9fa74002/ui/widgets/sortable.js#L976

helper .width ( this .currentItem .width () + 1);

Change History (0)

Note: See TracTickets for help on using tickets.