Move 'debugger' panel in Sources in Chrome DevTools?

Question

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:

Answer 1

Go to the DevTools settings, find General > Appearance > Panel layout option and change it to "horizontal".