Working with Layout and Graphical Design

[SimonFlack]

Hey guys.

I have been doing a bit of mobile work lately and came across a little trick that has really made my life a lot easier.

I am using Safari now (This did not work in chrome)
window.resizeTo(320,556)

Note: I am using a mac where the minimum browser window width seems to be 400px.

This pretty much gives you a perfect iPhone size that you can use to fine tune your design without having to deploy to your phone to test.

Anyway... Just thought I would post it.

37294

[estesbubba]

I use this extension on Chrome for different device sizes:

https://chrome.google.com/webstore/detail/kkelicaakdanhinjdeammmilcgefonfh

[SimonFlack]

Yeah. I tried that.

The 320x480 iphone setting did not work for me. Resulting width was 400px (standard minimum on mac)

Maybe its mac issue.

[estesbubba]

If you have a bunch of extension icons it won't allow the browser to shrink beyond a minimum width. If you increase the omnibar size (which hides the icons) it will. Also, there is an option to have the size be the viewport or actual browser window.

[estesbubba]

BTW, I'm on Windows so it could be different on Mac

[kostysh]

try "Ripple Emulator" Google Chrome extension:
https://chrome.google.com/webstore/detail/geelfhphabnejjhdalkjhgipohgpdnoc?hl=en-US&utm_source=chrome-ntp-launcher

not page resizing only but more tools for mobile apps testing