How to simulate device-width and orientation in browser to test media queries?

Question

I'm developing my website locally and using Chrome to preview it as I go. While it's really easy to resize the browser to test media queries that use max/min-width, it's not possible from what I can tell to simulate max/min-device-width with any built in settings. Is there a Chrome extension that will simulate a mobile device and trigger media queries, specifically max/min-device-width and also orientation:portrait/landscape?

I basically would like some way to test this media query with Chrome on my computer rather than a smartphone:
@media only screen and (max-device-width: 600px) and (orientation: portrait)

Answer 1

Mobile device emulation is available as a built-in feature for Chrome, currently in the Beta channel. You need to enable it in the DevTools settings.

Answer 2

Give this one a try...I think it's exactly what you need... https://chrome.google.com/webstore/detail/responsiview/kcemonjjmilbiepahkhanlkddonpjlep?hl=en-US