Search code examples
mootoolsstylesheetsortables

MooTools Sortables with horizontal list having problems

I am having problems sorting list items using the Sortables class when the list items are displayed horizontally. Removing this style fixed everything:

display: inline

Created an example on jsfiddle.

This works. Check the stylesheet for .countries li - it does not display the list inline - http://jsfiddle.net/Wgpqw/

This does not work properly. I can drag the list items around the list, but the sort randomly happens when moving around - http://jsfiddle.net/Wgpqw/1/

I suspect it has something to do with the list element positioning in inline mode. Any help is greatly appreciated.

Solution

  • Found a solution. Change the styling of ul to display: table and the li elements to display: table-cell.

    Hacky you say? it works :)

    Updated code on fiddle: http://jsfiddle.net/Wgpqw/2/