Google Chrome Developer Tools - disable black emulation options ruler

google-chrome google-chrome-devtools rulers
Jeremy Moritz picture Jeremy Moritz · Oct 10, 2014 · Viewed 30.3k times · Source

In Google Chrome version 38+, there's a new black ruler with Device emulation options. Does anyone know how to disable this?

ruler and emulation options

Answer

Gohn67 picture Gohn67 · Oct 11, 2014

You can hide it by toggling the "Device Mode" button. I'm on Chrome 38 on OSX if that matters.

Note that the rulers will still show up if you need to do Device emulation.

enter image description here

This is from the Chrome Developer docs: https://developer.chrome.com/devtools/docs/device-mode

Windows: Ctrl + Shift + M

Mac: Cmd + Shift + M

Related questions

Disabling Chrome cache for website development

I am modifying a site's appearance (CSS modifications) but can't see the result on Chrome because of annoying persistent cache. I tried Shift+refresh but it doesn't work. How can I disable the cache temporarily or refresh the page in …

Read More
How do you launch the JavaScript debugger in Google Chrome?

When using Google Chrome, I want to debug some JavaScript code. How can I do that?

Read More
"CAUTION: provisional headers are shown" in Chrome debugger

I noticed a strange caution message when looking at downloaded resources using Google chrome inspector (F12): Caution provisional headers are shown I found something possibly relevant, Network Panel: add caution about provisional request headers, but I could not fully understand …

Read More