Avatar for Username

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

userChrome.css is not being applied

  • 3 balasan
  • 1 memiliki masalah ini
  • 46 kunjungan
  • Balasan terakhir oleh cor-el

mhlangalyton
mhlangalyton
more options

I am trying to have Firefox show an "X" on every tab as soon as I hover above it. I followed a certain article and implemented this code:

/* Show Tab Close buttons only when hovered */

  1. tabbrowser-tabs > .tabbrowser-tab:not([pinned="true"]) > .tab-stack > .tab-content > .tab-close-button { 
 visibility: collapse !important;
 opacity: 0 !important;
 transition: all 250ms ease-in-out !important;

}

  1. tabbrowser-tabs > .tabbrowser-tab:not([pinned="true"]):hover > .tab-stack > .tab-content > .tab-close-button { 
 visibility: visible !important;
 opacity: 1 !important;
 transition: all 250ms ease-in-out !important;;

}

  1. tabbrowser-tabs > .tabbrowser-tab:not([pinned="true"]) > .tab-stack > .tab-content > .tab-close-button { 
 display: -moz-box !important;

}


This code is however not being implemented no matter how many times I restart Firefox. 'toolkit.legacyUserProfileCustomizations.stylesheets' is set to True The location is userChrome.css is '/home/user1/.mozilla/firefox/yqomjsh9.default-release-1672744596809/chrome/userChrome.css'

What could be the issue? I tried adding executable permissions using "chmod" but that did not change anything.

I am trying to have Firefox show an "X" on every tab as soon as I hover above it. I followed a certain article and implemented this code: /* Show Tab Close buttons only when hovered */ #tabbrowser-tabs > .tabbrowser-tab:not([pinned="true"]) > .tab-stack > .tab-content > .tab-close-button { visibility: collapse !important; opacity: 0 !important; transition: all 250ms ease-in-out !important; } #tabbrowser-tabs > .tabbrowser-tab:not([pinned="true"]):hover > .tab-stack > .tab-content > .tab-close-button { visibility: visible !important; opacity: 1 !important; transition: all 250ms ease-in-out !important;; } #tabbrowser-tabs > .tabbrowser-tab:not([pinned="true"]) > .tab-stack > .tab-content > .tab-close-button { display: -moz-box !important; } This code is however not being implemented no matter how many times I restart Firefox. 'toolkit.legacyUserProfileCustomizations.stylesheets' is set to True The location is userChrome.css is '/home/user1/.mozilla/firefox/yqomjsh9.default-release-1672744596809/chrome/userChrome.css' What could be the issue? I tried adding executable permissions using "chmod" but that did not change anything.

Pilih solusi

Try to keep the code simple and do not try to add all nodes (you missed #tabbrowser-arrowscrollbox). 

/* Show Tab Close buttons only when hovered */
#tabbrowser-tabs .tabbrowser-tab:not([pinned]) .tab-close-button {
  visibility: collapse !important;
  opacity: 0 !important;
  transition: all 250ms ease-in-out !important;
}
#tabbrowser-tabs .tabbrowser-tab:not([pinned]):hover .tab-close-button {
  visibility: visible !important;
  opacity: 1 !important;
  transition: all 250ms ease-in-out !important;;
}
#tabbrowser-tabs .tabbrowser-tab:not([pinned]) .tab-close-button {
  /* only use one of these */
  display: -moz-box !important; /*xx-112*/
  display: flex !important; /*113+*/
}

/* TAB: close button colors on hover */
.tab-close-button:hover {
  background-color: rgba(255,0,0,.7) !important;
  fill: white !important;
}

Baca jawaban ini dalam konteks 👍 2

Semua Balasan (3)

Dropa
Dropa
  • Top 10 Contributor
more options

For userChrome.css installs one needs to read instructions from the css site your using for userChrome.css on how to install for your O/S version. userChrome.css isn't provided help on Firefox forum since it's not a default program built into Firefox and support is provided for userChrome.css from the site that one gets the custom userChrome.css from.

Helpful?

James
James
  • Top 25 Contributor
  • Moderator
more options

People are still welcome to try and get help with userChrome.css edits here as there are some people familiar with such here.

Helpful?

cor-el
cor-el
  • Top 10 Contributor
  • Moderator
more options

Solusi Terpilih

Try to keep the code simple and do not try to add all nodes (you missed #tabbrowser-arrowscrollbox). 

/* Show Tab Close buttons only when hovered */
#tabbrowser-tabs .tabbrowser-tab:not([pinned]) .tab-close-button {
  visibility: collapse !important;
  opacity: 0 !important;
  transition: all 250ms ease-in-out !important;
}
#tabbrowser-tabs .tabbrowser-tab:not([pinned]):hover .tab-close-button {
  visibility: visible !important;
  opacity: 1 !important;
  transition: all 250ms ease-in-out !important;;
}
#tabbrowser-tabs .tabbrowser-tab:not([pinned]) .tab-close-button {
  /* only use one of these */
  display: -moz-box !important; /*xx-112*/
  display: flex !important; /*113+*/
}

/* TAB: close button colors on hover */
.tab-close-button:hover {
  background-color: rgba(255,0,0,.7) !important;
  fill: white !important;
}

Diperbarui oleh cor-el pada

Helpful?

Ajukan pertanyaan

You must log in to your account to reply to posts. Please start a new question, if you do not have an account yet.