Horizontal lists work poorly due to a jQuery UI bug.

[nateroling]

Horizontal sortable lists work poorly. This is because jQueryUI doesn't detect them as being horizontal.

Due to a bug in jQueryUI (http://bugs.jqueryui.com/ticket/7498), empty lists will never be considered horizontal.

When the sortable is created by Angular, the list is always empty. Thus, never detected as horizontal.

As an ugly workaround, you can set up a start listener to set the floating property manually, and sorting will work smoothly again:

 $scope.sortableOptions = {
    start: function(e, ui) {
      $(e.target).data("ui-sortable").floating = true;
    },
  };
});

<div ng-model='items' ui-sortable='sortableOptions'>

[oisinlavery]

Excellent, thanks for this fix.

[thgreasi]

Based on @ozzilee 's remark.
Please test on this Example pen and comment.

[mparker11]

Thank you very much! My project has nothing to do with Angular, but I needed this for my horizontal list!

[ChiragMoradiya]

Thanks, this helped me to solve issue for the tabs on https://kerika.com

[thecatontheflat]

Wow!
Thanks man!
I was googling for my problem, because placeholder was feeling quite sticky. And your solution solved it!

Many kudos for you, @ozzilee