Chrome Dev Tools Split Vertically while Detached?

2
votes

When using the Chrome Dev Tools window detached from the browser window, is it possible to change the layout to be split vertically instead of horizontally?

In the Dev Tool options there is an option to split vertically but it only applies when the Dev Tools window is attached to the right side of the browser window. Doesn't have any effect when the window is detached.

See the screenshot below: Things are too cramped with the horizontally laid out panels. If you could lay them out vertically it would be perfect.

Is this possible?

enter image description here

2
google-chrome-devtools

2 Answers

5
votes

[UPDATE] It looks like Panel layout setting is now respected in detached windows (tested in Chrome 55).

Original, outdated, answer below.

This is not an exposed option, but it's possible:

  • undock DevTools window (A),
  • focus on that window and hit alt+cmd+J,

  • this will open another DevTools window (B) - in that window's console execute

    WebInspector.panels.elements._splitVertically(true)
  • close window B

enter image description here

The only issue here is that this change will not "stick". For each DevTools window you'll have to repeat above procedure. However, if you'd like this option to stick and to be exposed in the DevTools settings you can file a feature request on crbug.com.

0
votes

yes you can. just hold the doc button and you will get the option to view vertically. Or you can use the show windows side by side from the task bar.