I would like to type in a width value for the screen size so I can make proper break points. I often find myself trying to inch one pixel at a time from on size to another. This isn't always successful in Chrome, as I sometimes go by two pixels at a time. Is there a way to make the width a specific typed in width?
I am using Mac OS X. This question has to do with dev tools because I am asking how I can use it to set the browser window width using the keyboard. If I adjust the width between the dev screen and the page with my mouse, a number will appear giving the width and height of the window. This is useful when using breakpoints to create responsive websites. I would like to know how to do this with my keyboard so I don't have to use my mouse to get point by point precision.
Best Answer
In the Chrome Developer Tools, open Console, then select the tab Emulation. Here you'll find "Device" to select from a list of common devices (such as an iPhone; this will also change the user agent as sent to the server), and you'll find "Screen" to set the dimensions manually.
See also Mobile emulation in Chrome's help.