Firefox で、アクティブなタブの幅を広くする方法

（この記事は 地平線に行く とのマルチポストです）

タブをいくつも開いていると幅が狭くなってしまい、タブのタイトルが読めなくなることがよくあります。
そういうときに、アクティブなタブだけ幅が広くなっていると読めるのになるなーと思ったので、ハックしてみました。

設定方法

1. スタイルシートによるカスタマイズを有効化
   1. about:config を開く
   2. toolkit.legacyUserProfileCustomizations.stylesheets を true に設定
2. スタイルシートを作成
   1. about:support を開く¹
   2. プロファイルフォルダーの「フォルダーを開く」をクリック
   3. 新規に chrome フォルダを作成
   4. chrome フォルダの中に、userChrome.cssを作成
   5. userChrome.cssに以下の設定を記載
3. Firefox を再起動

.tabbrowser-tab[visuallyselected="true"]:not([pinned]) {
    min-width: 225px !important;
}

これで、アクティブなタブだけ幅が広くなります。
もとに戻すときは、userChrome.css を削除するだけでOK。

ホバー時にも幅を広げる設定

非アクティブなタブにマウスカーソルをあてたときにも、タブの幅が広くなるようにもできます。
使いにくく感じるときもありますので、お好みでどうぞ。

1. userChrome.cssに以下を追記

.tabbrowser-tab:not([visuallyselected="true"]):not([pinned]):hover {
    min-width: 225px !important;
}

注意事項

Firefox のバージョンアップなどで動きがおかしくなったり、バグったりする可能性があります。
そのときは、userChrome.cssを削除してください。

1. ロケーションバー（URLの入力欄）に about:support と入力して Enter を押下 ↩