在 Chrome DevTools 的源代码中移动 'debugger' 面板？

Question

当我使用宽屏时，我的浏览器中总是垂直显示 DevTools。我无法再让调试器面板显示在源文件内容下方。

为了澄清我指的是哪个面板，它在 'Sources' 选项卡下，然后是右侧的 'debugger' 面板，您可以在其中看到 Watch、Call stack、Scope、Breakpoints 等。您知道，所有有用的东西 :D

此面板将仅在源文件旁边垂直显示，而不是以前位于源文件下方的位置。这意味着我在一个非常高的纤细 window 中获得了源代码和调试工具，因此无法与实际视口一起使用。

有什么办法可以把它移回去吗？

编辑：这里是屏幕截图（我为 'before' 找到了一个旧的）。请注意您暂停的面板，步骤 into/over 等

之前：

之后：

Answer 1

转到 DevTools 设置，找到 General > Appearance > Panel layout 选项并将其更改为 "horizontal"。