[Mobile Responsiveness] Horizontal Scrolling Bug

[maxwellgerber]

Phone: Iphone 6 running 10.3.1
App: Google Chrome 62.0.3202.70

Steps to reproduce:
For the first page: visit steemdata.com on a mobile device and swipe left.
For the second page: visit mentions.steemdata.com on a mobile device, search for any user, and swipe left.

<iframe width="560" height="315" src="https://www.youtube.com/embed/otRnOQyHNA0" frameborder="0" gesture="media" allow="encrypted-media" allowfullscreen></iframe> There are a couple pages I found where swiping left produces undesirable behavior.

Home Page

Expected behavior:The Vimeo Iframe should not exceed the width of the screen. Swiping left or right should produce no effect since there is no horizontal overflow.

Actual Behavior: Swiping left causes the user to become disoriented and makes navigating the site confusing.

mentions.steemdata/find Page

Here we can see that the search bar is overflowing the page on the righthand side. Adding responsive sizing helpers should fix the issue.

Expected behavior: The header/search bar should match the width of the device, probably by spilling over to a second line. Swiping left or right should produce no effect since there is no horizontal overflow.

Actual Behavior:Swiping left causes the user to become disoriented and makes navigating the site confusing

---

Posted on Utopian.io - Rewarding Open Source Contributors

---