[Firefox Quantum] タブのマウスオーバー時にクローズボタンを表示する方法

概要

これまで Tab Mix Plus を利用してクローズボタンを表示させていたのだが、最新の Firefox ではサポートされなくなった為、ある一定のタブを開くとクローズボタンが見えなくなってしまった。

設定

userChrome.cssにスタイルを定義するだけで表示可能になる。

userChrome.css を作成する

プロファイルフォルダ内にuserChrome.cssがなければ作成する必要がある。
(以下は macOS でのファイルパス)

/Users/hiro/Library/Application Support/Firefox/Profiles/xxxx.default/chrome/userChrome.css

プロファイルフォルダは、トラブルシューティング情報の「プロファイルフォルダー」から開くことができる。

  1. Firefox のヘルプメニュー
  2. トラブルシューティング情報
  3. プロファイルフォルダー

プロファイルフォルダーの直下にchromeフォルダがなければ作成し、さらにuserChrome.cssを作成する。
Windows/macOS ともに同じ方法で良い。

追加するスタイル

下記のスタイルをuserChrome.cssへ追加する。

.tabbrowser-tab:not([pinned]):hover .tab-close-button {
  display: block !important;
}

これを追加することで「_タブをマウスオーバー時にクローズボタンを表示_」する事ができる。
Firefox を再起動して反映する。