MenuItem needs to scroll

[rseydler]

I have a DropdownMenu with approx 30 items in it from client data. This amount of data has the list ending off screen :( Is there a way to handle scrolling in the dropdown itself?

Thanks!

[veekeys]

Hello @rseydler,

This is achievable with simple css as you would do it to any other HTML element to make it scrollable.
Just apply class on the DropdownMenu component with overflow-y: auto and max-height to whatever size you want.
Check up this code sandbox for an example:
https://codesandbox.io/s/itwinui-react-scrollable-dropdown-y5ubb?file=/src/App.tsx

[rseydler]

Thanks for taking the time to reply to my beginner question. I need to stop thinking like a winforms developer!

[mayank99]

Just fyi, it is better to use overflow-y: overlay (and fallback to auto). Overlay scrollbars will appear over the content, and usually look better.

auto	overlay

[veekeys]

@rseydler I have updated the sandbox with @mayank99 suggestion, so you could check it up and apply same in your project.