I have a drag and drop question that looks good on full-screen but I can't shrink it down for phone screens so well. The page is navigating from top to bottom and has various knowledge checks as you go.
This is the full screen image. It has four columns and they snap to three, two and one as the size of the window is reduced. But if you have the question on a phone it'll be on one column and look something like this
This means that if you want to drag one of the answers from the bottom to one of the spaces at the top you'd have to scroll up a long way.
What alternatives to this layout would work on a smaller screen. I am currently considering making the answers section horizontally scrollable as the screen size changes. Something like the image below.
Where the grey area can scroll left and right and the white area can scroll up and down. Are there any more intuitive ways to layout/interact with this?