house button make red

User Help for Mozilla Firefox
Post Reply
User avatar
Suze
Posts: 467
Joined: January 14th, 2004, 5:58 pm

house button make red

Post by Suze »

how to make the house button red
thanks
Suze
hch
Posts: 111
Joined: July 24th, 2008, 2:45 pm

Re: house button make red

Post by hch »

In userChrome.css add

#home-button
{
fill: red !important;
}
User avatar
BuddhaNature
Posts: 537
Joined: January 3rd, 2008, 9:44 am
Location: Scotland

Re: house button make red

Post by BuddhaNature »

If you decide you want to deal with the other buttons see this thread: Changing home-button, back-button, forward-button, reload-button colours

For a list of colour-names that should work see: CSS Colors
OS: Windows 10 Pro. x64
User avatar
Suze
Posts: 467
Joined: January 14th, 2004, 5:58 pm

Re: house button make red

Post by Suze »

hch wrote:In userChrome.css add

#home-button
{
fill: red !important;
}
when I added this to my chrome page it turned everything that was already red back to black my forward arrow & reload button house never changed
Suze
User avatar
BuddhaNature
Posts: 537
Joined: January 3rd, 2008, 9:44 am
Location: Scotland

Re: house button make red

Post by BuddhaNature »

Suze, it might be helpful if you posted up the entire content the userChrome.css file you are trying to use so people can look see if there are any errors there. (Put the content into a code box when you post it here. Just look for the "Code" button when you are writing your post.)
OS: Windows 10 Pro. x64
User avatar
Suze
Posts: 467
Joined: January 14th, 2004, 5:58 pm

Re: house button make red

Post by Suze »

what is a code box???
Suze
User avatar
BuddhaNature
Posts: 537
Joined: January 3rd, 2008, 9:44 am
Location: Scotland

Re: house button make red

Post by BuddhaNature »

To find the code (box) button do the following:

(1) Start to type in part of your intended post into the editing box.
(2) Now click on the "Preview" button. You will be taken to a webpage that looks a bit different. You will see "editing" buttons there that you don't normally see if you are doing a quick reply to post.
(3) At the top of the edit box that you can now see there is a button titled "Code"
(4) Now paste your css code into the editing box, then highlight all that code and click the "Code" button.
(5) Now click the Preview button (again) and you should see that your css code is now in a code-box, something like this:

Code: Select all

This isn't code
It is only
Intended to show
What a Code-box looks like.
OS: Windows 10 Pro. x64
User avatar
Suze
Posts: 467
Joined: January 14th, 2004, 5:58 pm

Re: house button make red

Post by Suze »

my userChrome
-------------------------------------------------------------------------------------------------
/* Firefox userChrome.css */

@namespace url("http://www.mozilla.org/keymaster/gateke ... s.only.xul");

.tab-throbber { visibility: hidden !important; }

/* tabs on bottom */
#navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar) {-moz-box-ordinal-group:10}
/* Search Bar width */
.searchbar-textbox {
max-width: 300px !important;
min-width: 100px !important; }

.tab-background {
border-radius: 10px 10px 0px 0px !important;
border-image: none !important; }

.tab-line {
display: none; }
#TabsToolbar {-moz-box-ordinal-group:1000!important}?


/* Search Bar width */
.searchbar-textbox {
max-width: 500px !important;
min-width: 300px !important; }
}



#back-button {
fill: red !important;
}

#forward-button {
fill: blue !important;
}

#reload-button {
fill: red !important
Suze
User avatar
BuddhaNature
Posts: 537
Joined: January 3rd, 2008, 9:44 am
Location: Scotland

Re: house button make red

Post by BuddhaNature »

I'm not an expert on CSS code but I saw what I thought were several mistakes in what you posted.

Try the following:

(1) Right-click on your userChrome.css file and select "Copy".
(2) In some empty space in the chrome folder right-click and select "Paste". You now have a backup of your current userChrome.css file titled "userChrome - Copy.css"
(3) Now right-click on your userChrome.css file and select "Open With... > Notepad"
(4) Now delete all of the content of that file and copy and paste all the code in the code-box below into Notepad.
(5) Save the Notepad file.
(6) Close down and restart FF and see if the edited code gives you the desired result. (It worked on my system when I tested it. But change the colours to suit yourself.)

Code: Select all

/* Firefox userChrome.css */

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

.tab-throbber { visibility: hidden !important; }

/* tabs on bottom */
#navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar) {-moz-box-

ordinal-group:10}
/* Search Bar width */
.searchbar-textbox {
max-width: 300px !important;
min-width: 100px !important; }

.tab-background {
border-radius: 10px 10px 0px 0px !important;
border-image: none !important; }

.tab-line {
display: none !important; }
#TabsToolbar {-moz-box-ordinal-group: 1000 !important;}

/* Search Bar width */
.searchbar-textbox {
max-width: 500px !important;
min-width: 300px !important; }

#home-button {fill: red !important;}
#back-button {fill: red !important;}
#forward-button {fill: blue !important;}
#reload-button {fill: red !important;}
OS: Windows 10 Pro. x64
User avatar
Suze
Posts: 467
Joined: January 14th, 2004, 5:58 pm

Re: house button make red

Post by Suze »

BuddhaNature thanks so very much everything is now in full color

including for 1st time I now have a red house

thanks again
Sue
Suze
User avatar
lovemyfoxy
Posts: 2337
Joined: December 11th, 2009, 11:23 am
Location: USA

Re: house button make red

Post by lovemyfoxy »

But do you have a white picket fence and an English country garden? ;-)
2 Desktops--Win 7 Ult.SP1 x64/6GB RAM /Firefox 52.9ESR/Waterfox64 2022.11/Thunderbird 52.9ESR/BitWarden PW Manager/Verizon FIOS wired network
Post Reply