You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Bug
I have a sidebar in position sticky, inside is a Droppable and inside some Draggables.
This is the CSS of the sticky container :
display: flex;
flex-direction: column;
position: sticky;
top: 70px;
right: 0;
height: calc(100vh - 70px);
max-width: 90px;
In there I have a Droppable with overflow: auto and a max-height: 84vh
And in there some Draggables that can be reorganised by drag-n-drop.
Expected behavior
When I move a Draggable near the edge of the Droppable container, it would automatically scroll the Droppable container with overflow: auto
Actual behavior
When I move a Draggable the window starts scrolling, the Droppable doesn't scroll at all, even when I reach the end of the window scroll, I still can't make my container scroll.
What version of React are you using?
16.4
What version of react-beautiful-dnd are you running?
9.0.2
What browser are you using?
Chrome 69
Demo Demo
The weird thing is, this seems to be an edge case with the height of the container, if you change 90vh to 50vh, it works as expected.
And in my case, I need to have my sidebar sticky and taking full height of the viewport - my header's height.
The text was updated successfully, but these errors were encountered:
Bug
I have a sidebar in position sticky, inside is a Droppable and inside some Draggables.
This is the CSS of the sticky container :
display: flex;
flex-direction: column;
position: sticky;
top: 70px;
right: 0;
height: calc(100vh - 70px);
max-width: 90px;
In there I have a Droppable with overflow: auto and a max-height: 84vh
And in there some Draggables that can be reorganised by drag-n-drop.
Expected behavior
When I move a Draggable near the edge of the Droppable container, it would automatically scroll the Droppable container with overflow: auto
Actual behavior
When I move a Draggable the window starts scrolling, the Droppable doesn't scroll at all, even when I reach the end of the window scroll, I still can't make my container scroll.
What version of React are you using?
16.4
What version of react-beautiful-dnd are you running?
9.0.2
What browser are you using?
Chrome 69
Demo
Demo
The weird thing is, this seems to be an edge case with the height of the container, if you change 90vh to 50vh, it works as expected.
And in my case, I need to have my sidebar sticky and taking full height of the viewport - my header's height.
The text was updated successfully, but these errors were encountered: