My “go to” desktop browser for doing web development is the Chrome browser. It’s got lots of cool plugins, and doesn’t crash as often as Firefox does (for me, at least).
However, it has one annoying problem for people like me who do responsive web development: It won’t resize down to 320 pixels wide, the width of an iPhone. With my Chrome browser on Windows, the minimum width is 500px. On Mac, the minimum is 400px. This makes it a pain to quickly check mobile layouts during development. You can’t make the Chrome browser window thin enough!
Firefox, on the other hand, will get as thin as I need it to! But, It’s inconvenient to have to use two different browsers during development.
The First Solution: Dev Tools
One solution is to use Chrome’s dev tools console and click the “mobile” icon in the upper left corner:
Click that icon and the corresponding Chrome window will show a shrunk down version of your site.
The Second Solution: Enter Your URL Here
This works on Chrome for Mac and Windows. During development, I launch this once, and refresh it using the F5 key.
Hope you find this useful!! – Brian