Transform Translate with Positive Value make a scrollbar

Question

I try to make a mobile menu: http://animesector.budi.upperyard.de/

You can see at the top Header Bar 2 Menu Buttons. The right one give the Content area transform(translateX(-200px)); The left one give the Content area transform: translateX(200px);

The Negative (-) value dont create a Scrollbar horizontal Scrollbar... But the Positive one does. have anyone any solution for this problem?

I tried to give the div around a overflow: hidden; but this didn't work for me.

Answer 1

You can prevent the horizontal scrollbar with overflow-x: hidden in the body element. Tried it right in the browser with dev tools and worked perfectly.