Highlight the active tab in Firefox
Published: March 24th, 2007
If you want the active tab to stand out in your current tab set, edit your userChrome.css file located in your profile folder and add the following lines:
.tabbrowser-tab[selected="true"] > hbox,
.tabbrowser-tab[selected="true"] > .tab-close-button {
background-color: #000088 !important;
color: #fff !important;
}
.tabbrowser-tab[selected="true"]:hover > hbox,
.tabbrowser-tab[selected="true"]:hover > .tab-close-button {
background-color: #0000BB !important;
color: #fff !important;
}
The code above will turn the active tab blue, but you can set it to your favorite color by editting the background-color value in lines 3 and 8 to some other hexadecimal value you can get here.
This entry was posted
on Saturday, March 24th, 2007 at 12:46 am and is filed under Firefox, Tips.
You can follow any responses to this entry through the RSS 2.0 feed.
You can leave a response, or trackback from your own site.
Subscribe RSS
Subscribe email
March 24th, 2007 at 9:39 am
I have not had problems with changes to my userChrome.css file before. However, adding the code mentioned in this tip has not changed the look of my browser tabs. I thought it could be because of the theme I had chosen. So, I went back to the original FF theme. After several restarts, the tabs still do not show a different color. What could possibly be wrong?
[Reply]
March 24th, 2007 at 12:19 pm
Just a quick follow-up to my previous note. I finally got this tip to work after trying it on a 3rd theme. It wouldn’t work on the default FF theme, but it does work on iFox.
[Reply]
March 24th, 2007 at 1:40 pm
Which just begs the question….why don’t they make it easy to change in the preferences? It’s a very user friendly feature.
[Reply]
March 24th, 2007 at 2:12 pm
Egídio, good to know if finally worked for you. I’m using the default theme and had no problem at all. Try deleting everything else from userChrome.css (after macing a backup copy) to discard a conflict with some other customization.
[Reply]
March 25th, 2007 at 2:21 pm
Does not work here with the default theme (the only one I have installed) either. Running FF 2.0.0.2 under Linux.
[Reply]
March 26th, 2007 at 11:28 pm
I’m having trouble getting this to work with the default theme, too. Firefox 2.0.0.3 on XP in my case.
[Reply]
March 28th, 2007 at 12:12 am
http://userstyles.org/style/show/1179
[Reply]
March 28th, 2007 at 4:23 pm
If don’t work, it is because of the copy & paste…
Attention with the quotation marks that the wordpress places in the code. ” for him is ´´
regards,
Paulo
[Reply]
August 16th, 2007 at 10:26 pm
im have the same problem i cant choose
“I’m having trouble getting this to work with the default theme, too. Firefox 2.0.0.3 on XP in my case.
“
[Reply]
August 19th, 2007 at 4:56 pm
The problem is that the code shown above has funny quotation marks (probably inserted by the blogging software). Use normal double-quotes and they will work:
.tabbrowser-tab[selected="true"] > hbox,
.tabbrowser-tab[selected="true"] > .tab-close-button {
background-color: #000088 !important;
color: #fff !important;
}
.tabbrowser-tab[selected="true"]:hover > hbox,
.tabbrowser-tab[selected="true"]:hover > .tab-close-button {
background-color: #0000BB !important;
color: #fff !important;
}
[Reply]
August 19th, 2007 at 4:56 pm
Ah shoot, it converted the double-quotes again. Anyway, make them normal double-quotes and it will work.
[Reply]
May 31st, 2008 at 2:15 pm
It should be pointed out that the above solution to active tab highlighting does not necessarily work in linux/X11. At least it does not work in my case where I use a focus-follows-mouse type behavior instead of click-to-focus type behavior. Tthe active tab highlights blue only when I pass the mouse pointer over the tab. Hence the solution is ok for Windows XP et al, but may not be for linux/X11.
I should also mention that in Win XP, I get the active tab highlighted already without doing any hack whereas in linux/X11 I do not. (I’m using firefox 2.0.0.14, this may not be significant). The tab highlight out-of-the-box may be due to a different choice of background colors, I do not know with certainty.
[Reply]