Can't scroll up and down sub menu on mobile device

On this website I am working on the submenu appearing below “Propiedades” in a mobile device (or when using the developers tools to simulate a narrow screen) I can’t up and down the sub items 2 are showing up on the print screen but they are more than that: it has the overflow-y set to scroll. What am I missing ?


I’m away for a week without a computer so can’t debug your code but I can guess that the issue is you have not set a height that matches the viewport height for the menu and thus it will not scroll.

Fixed elements do not scroll with the viewport so you need to make sure that they can scroll within themselves.

I suggest using a max-height:100vh on the main menu parent along with the overflow:auto to allow it to scroll. The overflow on the submenu will only work if the fixed menu parent is controlled within the viewport.

I changed the max-heigth value from 250px to 100px and it seems to be better.

Thank you

No that’s called a magic number as it doesn’t relate to anything specific. On viewports smaller than you looked at the problem will still occur.

You need a foolproof method that does not rely on magic numbers which is why you should implement the changes I suggested.

The 100vh refers to the viewport height and therefore caters for all devices.

Never leave anything to chance and avoid magic numbers at all costs :slight_smile:


This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.