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

1 min read

概要

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

設定

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

userChrome.css を使えるようにする

  • about:config を開く
  • toolkit.legacyUserProfileCustomizations.stylesheets
    真偽値をtrueに変更する

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 を再起動して反映する。