I try to have a menu hidden on the right of my screen (with a transform), and it comes back on the screen when the icon is hovered. It works perfectly fine on desktop (chromium and firefox), but acts weirdly on mobile (chrome and firefox).

Here it how it appears when it's supposed to be hidden on mobile.

I tried this code in a new project with this and nothing more, and it keeps having a weird behavior on mobile and on mobile emulation with firefox dev tools. Can't manage to have it using snippet tho.

As for the original issue, it is not working perfectly for me on desktop if I go by your statement of 'pressing a button'. there's only a hover interaction:

It seems like you either did not describe your problem adequately, or your sample code does not really look like your real thing.

CodePudding user response：

Alright. So I managed to fix it by adding position: fixed; to the parent of my menu. I'm not sure if I fixed it or if it's sort of a cheat code, but yet it works.