To be honest, the same issue happens on desktop browsers, it's just not as noticeable because the default zoom kinda matches what you'd expect. But you can still scroll to the side, in a desktop browser. See:
However, different browsers behave differently™, so you may need to also add:
word-wrap: break-word;
white-space: pre-wrap;
To make it work in Firefox (but you might need to adjust other things, also play with word-break CSS property, and test in all browsers). I've dealt with this previously at https://github.com/shurcooL/play/issues/4 and other places that deal with displaying user generated content.
http://instantshare.virtivia.com:27080/1eikl92n5jtyc.PNG - default view
http://instantshare.virtivia.com:27080/o1wn6nbthvuu.PNG - after zooming in unsuccessfully, OR just scrolling to the right
http://instantshare.virtivia.com:27080/eiw3z2u1n52h.PNG - fully zoomed out
http://instantshare.virtivia.com:27080/1jsmbx8km815h.PNG - the culprit causing this, a long URL which isn't being wrapped by your CSS rules
To be honest, the same issue happens on desktop browsers, it's just not as noticeable because the default zoom kinda matches what you'd expect. But you can still scroll to the side, in a desktop browser. See:
http://instantshare.virtivia.com:27080/b69zdjyzbvfo.png
I think the CSS fix can be something like this:
http://instantshare.virtivia.com:27080/1l8rbeisu9a2a.pngHowever, different browsers behave differently™, so you may need to also add:
To make it work in Firefox (but you might need to adjust other things, also play with word-break CSS property, and test in all browsers). I've dealt with this previously at https://github.com/shurcooL/play/issues/4 and other places that deal with displaying user generated content.