Can't easily drag widgets below widgets on the bottom border of a grid

[derekm]

Gridster pops a few blank rows at the bottom of a grid, making it easy for your drag to scroll the window downward. When a gridstack grid has filled the window, it is impossible to drag a widget below any widget that touches the bottom border. Turning on float causes drags to add extra rows as needed. With float off, it could do the same then let the block fall upward into position.

[svdb]

Just wrap your gridstack DIV inside a parent DIV, then give the parent DIV a padding-bottom >= the stackgrid row height.
So when you move a widget down you always have extra space and stackgrid will add a new row.

[radiolips]

@derekm did adding padding work? It should. I'm closing this issue, but please feel free to reopen it if you still have a problem.

[frankadrian]

Hey @radiolips, This does not seem to work for items that are being dragged from another grid. I will try create a example for this!

[frankadrian]

The behaviour can be seen here: https://gridstackjs.com/demo/two.html

Try dragging an item from one grid below an item in the other grid!

[trongletps]

I had same issue with @frankadrian. When I set float equal false, to difficultly to drag the widget below one from the grid to the another grid.

[trongletps]

Everything work well except this case but it's very important with user experience, so uncomfortable when drag and drop item from sidebar to main grid (drag item from sidebar below the other items in main grid).

[stevenliebregt]

What is the status off this issue?

[adumesny]

see #1094 as well

[adumesny]

this might get fixed along #1001 as we will add an extra temporary row the moved/resized item is at the bottom.

[adumesny]

it is now possible in v3 HTML5 drag version (we get auto-scroll) but a little rough so keeping it open to address side effects shown below:

20210103_092419.mp4

[adumesny]

should work a lot better now in next release.

we now automatically insert extra rows when dragging an item at the bottom below others to make it easier to insert below, while allowing objects to be easily removed (not colliding with others)

20210404_081138.mp4