MozillaZine

house button make red

User Help for Mozilla Firefox
Suze

User avatar
 
Posts: 467
Joined: January 14th, 2004, 5:58 pm

Post Posted March 4th, 2018, 7:03 pm

how to make the house button red
thanks
Suze

hch
 
Posts: 101
Joined: July 24th, 2008, 2:45 pm

Post Posted March 4th, 2018, 8:50 pm

In userChrome.css add

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

BuddhaNature

User avatar
 
Posts: 239
Joined: January 3rd, 2008, 9:44 am
Location: Scotland

Post Posted March 5th, 2018, 6:03 am

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 7 Pro. x64

Suze

User avatar
 
Posts: 467
Joined: January 14th, 2004, 5:58 pm

Post Posted March 5th, 2018, 9:50 am

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

BuddhaNature

User avatar
 
Posts: 239
Joined: January 3rd, 2008, 9:44 am
Location: Scotland

Post Posted March 5th, 2018, 10:36 am

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 7 Pro. x64

Suze

User avatar
 
Posts: 467
Joined: January 14th, 2004, 5:58 pm

Post Posted March 5th, 2018, 10:43 am

what is a code box???
Suze

BuddhaNature

User avatar
 
Posts: 239
Joined: January 3rd, 2008, 9:44 am
Location: Scotland

Post Posted March 5th, 2018, 10:54 am

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 7 Pro. x64

Suze

User avatar
 
Posts: 467
Joined: January 14th, 2004, 5:58 pm

Post Posted March 5th, 2018, 11:09 am

my userChrome
-------------------------------------------------------------------------------------------------
/* 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; }
#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

BuddhaNature

User avatar
 
Posts: 239
Joined: January 3rd, 2008, 9:44 am
Location: Scotland

Post Posted March 5th, 2018, 11:49 am

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 7 Pro. x64

Suze

User avatar
 
Posts: 467
Joined: January 14th, 2004, 5:58 pm

Post Posted March 5th, 2018, 1:20 pm

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

LoveMyFoxy

User avatar
 
Posts: 2139
Joined: December 11th, 2009, 11:23 am
Location: USA

Post Posted March 6th, 2018, 10:54 pm

But do you have a white picket fence and an English country garden? ;-)
Desktop--Win 7 Ult. 64-bit, 6GB RAM /FF 52ESR 64/ Thunderbird 52 / MS Sec. Essent./ Windows firewall / Verizon FIOS

Return to Firefox Support


Who is online

Users browsing this forum: Bing [Bot], Google [Bot] and 7 guests