Google Groups no longer supports new Usenet posts or subscriptions. Historical content remains viewable.
Dismiss

Change current tab color

938 views
Skip to first unread message

Bradley

unread,
Aug 31, 2007, 9:01:39 AM8/31/07
to
Hey all,
I've put this code in userChrome.css but can't get it to change FF's
current tab color.

/* Change color of active tab */
.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;
}

All the default tab colors are so close that I can't tell which one is
current.

I've also put this same code in Mindfield and Grand Paradiso with no
success.

What am I doing wrong?

-b

Bradley

unread,
Aug 31, 2007, 9:13:47 AM8/31/07
to
Got this to work...

@namespace
url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);

.tabbrowser-tab[selected="true"] > hbox,
.tabbrowser-tab[selected="true"] > .tab-close-button {

background-color: #000 !important;
color: #0f0 !important;
}

.tabbrowser-tab[selected="true"]:hover > hbox,
.tabbrowser-tab[selected="true"]:hover > .tab-close-button {

background-color: #f00 !important;
color: #0f0 !important;
}

Tony Mechelynck

unread,
Aug 31, 2007, 10:10:40 AM8/31/07
to

Aha! So apparently you found a case where the @namespace line makes a
difference. Good to know...


I'm using the following, and it works too:

/*
* This file can be used to customize the look of Mozilla's user interface
* You should consider using !important on rules which you want to
* override default settings.
*/

/*
* For more examples see http://www.mozilla.org/unix/customizing.html
*/

/*
* Do not remove the following line, it is required for correct functioning
*/
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

/****************************************************************
* TABS *
****************************************************************/
/*
* highlight tab at mouseover; highlight selected tab
* and show which tabs haven't yet been read
*/
/* white for unread tabs */
.tabbrowser-tabs *|tab:not([selected])
{ background-color: white !important
}
/* dark red for non-current tabs at mouseover */
.tabbrowser-tabs *|tab:hover
{ background-color: #C00 !important
}
/* dark bluish grey for current tab */
.tabbrowser-tabs *|tab[selected=true]
{ background-color: #699 !important
}
/* bright yellow for current tab at mouseover */
.tabbrowser-tabs *|tab[selected=true]:hover
{ background-color: yellow !important
}


Best regards,
Tony.
--
SOLDIER: What? Ridden on a horse?
ARTHUR: Yes!
SOLDIER: You're using coconuts!
"Monty Python and the Holy Grail" PYTHON (MONTY) PICTURES LTD

John

unread,
Aug 31, 2007, 12:08:34 PM8/31/07
to

"Tony Mechelynck" <antoine.m...@belgacom.net> wrote in message
news:O6adnVPsF-L0vEXb...@mozilla.org...

> Bradley wrote:
>> Bradley wrote:
>>> Hey all,
>>> I've put this code in userChrome.css but can't get it to change FF's
>>> current tab color.
>>>
>>> /* Change color of active tab */
>>> .tabbrowser-tab[selected=杯rue脳 > hbox,
>>> .tabbrowser-tab[selected=杯rue脳 > .tab-close-button {

>>> background-color: #000088 !important;
>>> color: #fff !important;
>>> }
>>> .tabbrowser-tab[selected=杯rue脳:hover > hbox,
>>> .tabbrowser-tab[selected=杯rue脳:hover > .tab-close-button {


Ok, I've been following this, but not really sure what it is supposed to be
doing. You have written that code above. Can I ask, where do you add it to
get it to work?

Hope you dont mind me asking.

John


Peter Potamus the Purple Hippo

unread,
Aug 31, 2007, 12:37:05 PM8/31/07
to
John wrote:
> "Tony Mechelynck" <antoine.m...@belgacom.net> wrote in message
> news:O6adnVPsF-L0vEXb...@mozilla.org...
>> Bradley wrote:
>>> Bradley wrote:
>>>> Hey all,
>>>> I've put this code in userChrome.css but can't get it to change FF's
>>>> current tab color.
>>>>
>>>> /* Change color of active tab */
>>>> .tabbrowser-tab[selected=”true”] > hbox,
>>>> .tabbrowser-tab[selected=”true”] > .tab-close-button {
>>>> background-color: #000088 !important;
>>>> color: #fff !important;
>>>> }

well, you weren't following very closely, because the OP
said: "I've put this code in userChrome.css"

--
Please do not email me for help. Reply to the newsgroup
only. And only click on the Reply button, not the Reply All
or Reply to Author. Thanks!

Peter Potamus & His Magic Flying Balloon:
http://www.toonopedia.com/potamus.htm

John

unread,
Aug 31, 2007, 12:49:52 PM8/31/07
to

"Peter Potamus the Purple Hippo" <peter.potamus.t...@gmail.com>
wrote in message news:_fqdnZjzpqBm30Xb...@mozilla.org...

> John wrote:
>> "Tony Mechelynck" <antoine.m...@belgacom.net> wrote in message
>> news:O6adnVPsF-L0vEXb...@mozilla.org...
>>> Bradley wrote:
>>>> Bradley wrote:
>>>>> Hey all,
>>>>> I've put this code in userChrome.css but can't get it to change
>>>>> FF's current tab color.
>>>>>
>>>>> /* Change color of active tab */
>>>>> .tabbrowser-tab[selected=杯rue脳 > hbox,
>>>>> .tabbrowser-tab[selected=杯rue脳 > .tab-close-button {

>>>>> background-color: #000088 !important;
>>>>> color: #fff !important;
>>>>> }
>>>>> .tabbrowser-tab[selected=杯rue脳:hover > hbox,
>>>>> .tabbrowser-tab[selected=杯rue脳:hover > .tab-close-button {

Hi I'm sorry, I should have said a bit more. I self tought at using the pc,
and basically can surf, write letters, and do a few various other things, if
I have directions. I did see "I've put this code in userChrome.css" but like
I hinted, I have no idea what or where that is. Once I get showm/explained,
I can pick things up pretty easilly.

Thank you for your help.

John.


Peter Potamus the Purple Hippo

unread,
Aug 31, 2007, 1:50:26 PM8/31/07
to
John wrote:
> "Peter Potamus the Purple Hippo" <peter.potamus.t...@gmail.com>
> wrote in message news:_fqdnZjzpqBm30Xb...@mozilla.org...
>> John wrote:
>>> "Tony Mechelynck" <antoine.m...@belgacom.net> wrote in message
>>> news:O6adnVPsF-L0vEXb...@mozilla.org...
>>>> Bradley wrote:
>>>>> Bradley wrote:
>>>>>> Hey all,
>>>>>> I've put this code in userChrome.css but can't get it to change
>>>>>> FF's current tab color.
>>>>>>
>>>>>> /* Change color of active tab */
>>>>>> .tabbrowser-tab[selected=”true”] > hbox,
>>>>>> .tabbrowser-tab[selected=”true”] > .tab-close-button {
>>>>>> background-color: #000088 !important;
>>>>>> color: #fff !important;
>>>>>> }


Close FF.

the file userChrome.css is located in the Chrome directory
of the FF profile. To find the FF profile, you can read
this: http://www.mozilla.org/support/firefox/edit#profile

but if you're using windows, then you must read this first:
http://www.microsoft.com/windowsxp/using/helpandsupport/learnmore/tips/hiddenfiles.mspx

once you found the chrome directory, locate a file called
userContent-example.css. Open it, copy the scripts above,
paste it into the file. Now, save the file as
userChrome.css and save it as a text file.

If you don't have a chrome directory then create one. If
you don't have the userContent-example.css file, then create
one, but as I said, sve it as userContent.css and save it in
text formating.

John

unread,
Aug 31, 2007, 2:00:43 PM8/31/07
to

"Peter Potamus the Purple Hippo" <peter.potamus.t...@gmail.com>
wrote in message news:f4udnSfztNWxyUXb...@mozilla.org...

> John wrote:
>> "Peter Potamus the Purple Hippo"
>> <peter.potamus.t...@gmail.com> wrote in message
>> news:_fqdnZjzpqBm30Xb...@mozilla.org...
>>> John wrote:
>>>> "Tony Mechelynck" <antoine.m...@belgacom.net> wrote in message
>>>> news:O6adnVPsF-L0vEXb...@mozilla.org...
>>>>> Bradley wrote:
>>>>>> Bradley wrote:
>>>>>>> Hey all,
>>>>>>> I've put this code in userChrome.css but can't get it to change
>>>>>>> FF's current tab color.
>>>>>>>
>>>>>>> /* Change color of active tab */
>>>>>>> .tabbrowser-tab[selected=杯rue脳 > hbox,
>>>>>>> .tabbrowser-tab[selected=杯rue脳 > .tab-close-button {

>>>>>>> background-color: #000088 !important;
>>>>>>> color: #fff !important;
>>>>>>> }
>>>>>>> .tabbrowser-tab[selected=杯rue脳:hover > hbox,
>>>>>>> .tabbrowser-tab[selected=杯rue脳:hover > .tab-close-button {

Hi, thank you, I appreciate the help.

I'll give it a try and let you know how I get on.

John.


kes

unread,
Aug 31, 2007, 3:47:07 PM8/31/07
to
John wrote:
> "Peter Potamus the Purple Hippo" <peter.potamus.t...@gmail.com>
> wrote in message news:f4udnSfztNWxyUXb...@mozilla.org...
>> John wrote:
>>> "Peter Potamus the Purple Hippo"
>>> <peter.potamus.t...@gmail.com> wrote in message
>>> news:_fqdnZjzpqBm30Xb...@mozilla.org...
>>>> John wrote:
>>>>> "Tony Mechelynck" <antoine.m...@belgacom.net> wrote in message
>>>>> news:O6adnVPsF-L0vEXb...@mozilla.org...
>>>>>> Bradley wrote:
>>>>>>> Bradley wrote:
>>>>>>>> Hey all,
>>>>>>>> I've put this code in userChrome.css but can't get it to change
>>>>>>>> FF's current tab color.
>>>>>>>>
>>>>>>>> /* Change color of active tab */
>>>>>>>> .tabbrowser-tab[selected=”true”] > hbox,
>>>>>>>> .tabbrowser-tab[selected=”true”] > .tab-close-button {
>>>>>>>> background-color: #000088 !important;
>>>>>>>> color: #fff !important;
>>>>>>>> }

John, if that does not work out for you, try the following add-on:
Aging Tabs (currently v0.5.2)

It allows you to set your tabs any colour you want.
Get it here:
https://addons.mozilla.org/en-US/firefox/addon/3542

Much easier than messing around with code, and does some other stuff too.

Peter Potamus the Purple Hippo

unread,
Aug 31, 2007, 4:20:15 PM8/31/07
to
kes wrote:
> Much easier than messing around with code, and does some other stuff too.

That might be true, but there are people who don't want to
install [yet another] extension. After all, the more you
have, the more problems that can happen. Thats why farting
around with code does better than an extension.

Peter Potamus the Purple Hippo

unread,
Aug 31, 2007, 6:32:32 PM8/31/07
to
Peter Potamus the Purple Hippo wrote:
> kes wrote:
>> Much easier than messing around with code, and does some other stuff too.
>
> That might be true, but there are people who don't want to
> install [yet another] extension. After all, the more you
> have, the more problems that can happen. Thats why farting
> around with code does better than an extension.
>

actually, if you want to install an extension, the best one
for editing the userChrome.css file and the userContent.css
file is ChromEdit Plus.
http://webdesigns.ms11.net/chromeditp.html. This way, you
don't have to know where the files are located. Just open
ChromEdit, make the changes, save and close it and restart
the program.

Blinky the Shark

unread,
Aug 31, 2007, 6:37:07 PM8/31/07
to

John wrote:
> "Peter Potamus the Purple Hippo" <peter.potamus.t...@gmail.com>
> wrote in message news:_fqdnZjzpqBm30Xb...@mozilla.org...
>> John wrote:
>>> "Tony Mechelynck" <antoine.m...@belgacom.net> wrote in message
>>> news:O6adnVPsF-L0vEXb...@mozilla.org...
>>>> Bradley wrote:
>>>>> Bradley wrote:
>>>>>> Hey all,
>>>>>> I've put this code in userChrome.css but can't get it to change
>>>>>> FF's current tab color.
>>>>>>
>>>>>> /* Change color of active tab */

>>>>>> .tabbrowser-tab[selected=”true”] > hbox,
>>>>>> .tabbrowser-tab[selected=”true”] > .tab-close-button {

>>>>>> background-color: #000088 !important;
>>>>>> color: #fff !important;
>>>>>> }

Did you even *try* a file find for that name with Explorer or whatever
MS calls its file manager these days?


--
Blinky RLU 297263
Killing all posts from Google Groups
The Usenet Improvement Project:
http://improve-usenet.org <----------- New Site Aug 28

John

unread,
Aug 31, 2007, 7:01:58 PM8/31/07
to

"Peter Potamus the Purple Hippo" <peter.potamus.t...@gmail.com>
wrote in message news:ktSdnTZT69_XC0Xb...@mozilla.org...

Oh, I have Chrome edit plus, why I dont know, I think somebody mentioned it
on here a while back, and I installed it, but have never used it. I just
went to look and the userChrome.css is there just waiting for me to click on
it. I was just wondering that text you posted, do i just add it anywhere in
there or at the end?

John.


Terry R.

unread,
Aug 31, 2007, 7:24:47 PM8/31/07
to
On 8/31/2007 1:20 PM On a whim, Peter Potamus the Purple Hippo pounded
out on the keyboard

> kes wrote:
>> Much easier than messing around with code, and does some other stuff too.
>
> That might be true, but there are people who don't want to
> install [yet another] extension. After all, the more you
> have, the more problems that can happen. Thats why farting
> around with code does better than an extension.
>

But for something this simple, why mess with it. I use Colorful Tabs.
It's small and does the trick. I see your point (although it doesn't
happen nearly as much as it used to), but sometimes an extension just
seems to be the way to go. IMO, this is one of those.

--
Terry R.
Anti-spam measures are included in my email address.
Delete NOSPAM from the email address after clicking Reply.

captjlddavis

unread,
Aug 31, 2007, 7:44:37 PM8/31/07
to
Peter,
I know I must be missing something.....why would you open and edit
"userContent-example.css" and save as "userChrome.css" ?
Why not just open and edit "userChrome-example".css

regards:captjlddavis

captjlddavis

unread,
Aug 31, 2007, 7:50:10 PM8/31/07
to
Addendum....
...and then save "userChrome-example.css" as 'userChrome.css"

regards:captjlddavis

Peter Potamus the Purple Hippo

unread,
Sep 1, 2007, 1:38:34 AM9/1/07
to

slip up on my part, but it doesn't really matter if you
rename userContent-example.css to userChrome.css.

Peter Potamus the Purple Hippo

unread,
Sep 1, 2007, 1:38:36 AM9/1/07
to

thats because the FF profile is hidden in windows, so you
have to unhide window files first. Maybe thats the reason
he couldn't find it in the first place.

Peter Potamus the Purple Hippo

unread,
Sep 1, 2007, 1:42:07 AM9/1/07
to
John wrote:
> Oh, I have Chrome edit plus, why I dont know, I think somebody mentioned it
> on here a while back, and I installed it, but have never used it.

then work with ChromEdit Plus, it works better than trying
to find and open the said files. The only problem with
using the userChrome.css file is you have to restart FF,
even if you're using ChromEdit Plus, you still have to restart

> I just
> went to look and the userChrome.css is there just waiting for me to click on
> it. I was just wondering that text you posted, do i just add it anywhere in
> there or at the end?

I always place any new script at the end of the last one. I
just hit the enter key a few times to separate the last one
from the new one you're putting in.

Tony Mechelynck

unread,
Sep 1, 2007, 5:38:05 AM9/1/07
to
Peter Potamus the Purple Hippo wrote:
> John wrote:
>> Oh, I have Chrome edit plus, why I dont know, I think somebody
>> mentioned it on here a while back, and I installed it, but have never
>> used it.
>
> then work with ChromEdit Plus, it works better than trying to find and
> open the said files. The only problem with using the userChrome.css
> file is you have to restart FF, even if you're using ChromEdit Plus, you
> still have to restart
>
>> I just went to look and the userChrome.css is there just waiting for
>> me to click on it. I was just wondering that text you posted, do i
>> just add it anywhere in there or at the end?
>
> I always place any new script at the end of the last one. I just hit
> the enter key a few times to separate the last one from the new one
> you're putting in.
>

so do I, except that after some time (and some code) I decided to organize the
code in sections, with general comments and the @namespace line at the top, then

/*****************************************
* TABS *
*****************************************/

and the rules for tabs, then

/*****************************************
* FONTS *
*****************************************/

and the rules for fonts, text color, etc., and finally

/*****************************************
* MISCELLANEOUS *
*****************************************/

heading the rest.

The order of the rules doesn't matter when they concern different elements;
when several rules concern _the same_ element, the rule placed last overrides
any conflicting rule placed above it (so a rule for "tab:hover" must follow a
rule for "tab" or the latter will override the former.)


Best regards,
Tony.
--
Age before beauty; and pearls before swine.
-- Dorothy Parker

John

unread,
Sep 1, 2007, 5:45:33 AM9/1/07
to

"Peter Potamus the Purple Hippo" <peter.potamus.t...@gmail.com>
wrote in message news:pOKdnYh0qaRkZ0Xb...@mozilla.org...

It works. I use the macfox11graphite theme, because I like the look of it
better than the Default, when I use the default theme, it just has a line of
color looking like tramlines on each tab in the tab bar, but in the
macfox11graphite theme the whole tab button colour has changed, cool. Nice
change, thanks for that. :) I know which tab I'm in now.

John.


Tony Mechelynck

unread,
Sep 1, 2007, 5:57:49 AM9/1/07
to
Terry R. wrote:
> On 8/31/2007 1:20 PM On a whim, Peter Potamus the Purple Hippo pounded
> out on the keyboard
>
>> kes wrote:
>>> Much easier than messing around with code, and does some other stuff
>>> too.
>>
>> That might be true, but there are people who don't want to install
>> [yet another] extension. After all, the more you have, the more
>> problems that can happen. Thats why farting around with code does
>> better than an extension.
>>
>
> But for something this simple, why mess with it. I use Colorful Tabs.
> It's small and does the trick. I see your point (although it doesn't
> happen nearly as much as it used to), but sometimes an extension just
> seems to be the way to go. IMO, this is one of those.
>

To each his preferences. I would say: for something this simple, why install
an extension?

If I want something complex, where I wouldn't know where to begin, I hunt for
an extension. If I already know how to do it myself (or if I have a pretty
good idea), I don't bother to hunt.

Of course, YMMV.


Best regards,
Tony.
--
Economists state their GNP growth projections to the nearest tenth of a
percentage point to prove they have a sense of humor.
-- Edgar R. Fiedler

Peter Potamus the Purple Hippo

unread,
Sep 1, 2007, 1:40:41 PM9/1/07
to

thats what I do, but I didn't want to confuse a newbie ;-)

0 new messages