Horizontal scroll mobile example

1. How do I make my mobile scroll horizontal?
2. Why is there horizontal scroll on mobile?
3. How do you indicate a horizontal scroll?

How do I make my mobile scroll horizontal?

To implement this, we can use overflow:scroll on mobile, it will display scrollbars and make the content inside the box scrollable, preventing the content rendering outside the box. Use flex:none on mobile to “fix” the tags height, and max-width: fit-content on desktop to “fix” the tags width.

Why is there horizontal scroll on mobile?

The mobile horizontal scrolling has been caused by setting a high fixed / minimum width for an element. Set elements to "auto", or just reduce the width on mobile devices.

How do you indicate a horizontal scroll?

Horizontal scrolling can be achieved by clicking and dragging a horizontal scroll bar, swiping sideways on a desktop trackpad or trackpad mouse, pressing left and right arrow keys, or swiping sideways with one's finger on a touchscreen.