如何强制Firefox DevTools工具栏保持横向排列而非纵向分列？

Firefox的F12开发者工具多数时候显示为正常状态：

但拖动窗口扩大HTML查看空间时，工具栏会转为纵向分列，反而缩小了可用空间：

希望强制工具栏保持在侧边栏底部的横向排列状态，可通过以下方法实现：

方法：自定义CSS强制工具栏布局 #

通过Firefox的自定义样式功能，修改开发者工具的布局规则：

1. 启用自定义样式支持

   • 在地址栏输入 about:config，搜索 toolkit.legacyUserProfileCustomizations.stylesheets，将其值设为 true。

2. 定位用户配置文件夹

   • 地址栏输入 about:support，找到「配置文件夹」选项，点击「打开文件夹」。

3. 创建自定义样式文件

   • 在打开的文件夹中，新建名为 chrome 的子文件夹（若已存在则跳过）。
   • 在 chrome 文件夹内新建 userChrome.css 文件，添加以下代码：

/* 强制开发者工具工具栏保持横向排列 */
.devtools-toolbar {
  flex-direction: row !important;
  flex-wrap: nowrap !important;
}
.devtools-toolbar-button {
  flex-shrink: 0 !important;
}
/* 锁定底部工具栏横向布局 */
#toolbox-bottom-bar {
  flex-direction: row !important;
}

4. 重启Firefox，打开开发者工具后，工具栏将始终保持横向排列，不会随窗口尺寸变化转为纵向。

内容的提问来源于stack exchange，提问作者Ace