Solution 1 :

Either you can give overflow-y: scroll to the element or change height: 40vh; to min-height: 40vh;

Problem :

I have attached the sample problem here

When the screen size reduces the icons overflow out of the container and I want the overflowing items to get displayed in the next slide

This is how it is displayed in bigger screen size

icons before overflowing

When the window size is smaller it overflows like this

icons in smaller resolution

I want to display the icons which are overflowing in the next slide.

How can I calculate and move the overflowing items to next slide?

It should be responsive too. Any idea how to implement this ?

Any help would be appreciated!