I always have the DevTools showing vertically in my browser as I use a widescreen. I can no longer get the debugger panel to show underneath the source file content.
To clarify which panel I mean, its under 'Sources' tab, then the right 'debugger' panel where you can see Watch, Call stack, Scope, Breakpoints etc. You know, all the useful stuff :D
This panel will only show vertically alongside the source files, instead of where it used to be under the source file. This means I get both the source and debugging tools in a very tall slim window making it impossible to use alongside the actual viewport.
Any ideas how I can move it back?
Edit: Here are screenshots (I found an old one for the 'before'). Notice the panel where you pause, step into/over etc.
Before:
After:
Go to the DevTools settings, find General > Appearance > Panel layout option and change it to "horizontal".
来源：https://stackoverflow.com/questions/33482260/move-debugger-panel-in-sources-in-chrome-devtools