Tab bar not moving below bookmark bar???

[Flycaster]

Have been fairly successful in bringing FF57 to look like FF56, but have had trouble when trying to move the tab toolbar to below the bookmark bar. I have installed (using Notepad++) the following code into userChrome.css, caved the code properly and have restarted FF...but the tab bar still is located right under the title bar:

/* Tab bar below Navigation & Bookmarks Toolbars */
#nav-bar { /* main toolbar */
-moz-box-ordinal-group: 1 !important;
box-shadow: none !important;
}
#PersonalToolbar { /* bookmarks toolbar */
-moz-box-ordinal-group: 2 !important;
}
#TabsToolbar { /* tab bar */
-moz-box-ordinal-group: 3 !important;
padding-top: 0 !important;
}
/* Clean up spacing */
.titlebar-placeholder {
display: none !important;
}
toolbarbutton.bookmark-item {
padding-top: 2px !important;
padding-bottom: 2px !important;
}

[smsmith]

That code works for me. Is that the only code you have in the userChrome.css file? Did you put the userChrome.css file in the chrome folder inside of your profile folder?

[Flycaster]

That code works for me. Is that the only code you have in the userChrome.css file? Did you put the userChrome.css file in the chrome folder inside of your profile folder?

Only code in userChrome.css, and it is in the chrome folder which is inside the profile folder???

[Frank Lion]

Only code in userChrome.css

Code looks OK. You have it below the XUL namespace line?

[Flycaster]

Ah, don't know what that is and I don't have it. Would appreciate your cluing me in.

[dickvl]

Note that the chrome folder is in the AppData\Roaming location used for profiles.

Does other code in the userChrome.css work?
Did you verify the the file type is CSS (Cascading Style Sheet)?
http://kb.mozillazine.org/Editing_confi ... leshooting

Add code to the userChrome.css file below the default @namespace line.
http://kb.mozillazine.org/userChrome.css

Code: Select all

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

[Frank Lion]

Ah, don't know what that is and I don't have it. Would appreciate your cluing me in.

Dick has covered the namespace line and here's a tip to ensure that you always have the chrome folder and userChrome.css file in the right place and on the right profile -

Firefox Menu>Help>TroubleShooting Info> Open Folder or whatever > the window that then open is showing you the contents of the current profile in use for Firefox and that's where your chrome folder and contents should go.

[Flycaster]

Thanks Frank and Dick. I had the Chrome folder in the wrong place and was missing the "namespace" code. Once corrected, all worked just fine.

Now that I know how to utilize css files, there are only a few more things that I need to do to get me to a FF56 type interface that I desire. Perhaps, you could direct where to go to get the css codes, if they are available?

I would like to be able to:
1. Round the tab corners
2. Color the tab bar background (I am using Colorful Tabs and not sure if this will interfere with trying to do this. The present color of the tab bar background is white)
3. Change the fonts to bold on the benchmark and tab bars
4. Allow for three lines of tab bar
5. Site opens with cursor hover

[Frank Lion]

Perhaps, you could direct where to go to get the css codes, if they are available?

I would like to be able to:
1. Round the tab corners
2. Color the tab bar background (I am using Colorful Tabs and not sure if this will interfere with trying to do this. The present color of the tab bar background is white)
3. Change the fonts to bold on the benchmark and tab bars
4. Allow for three lines of tab bar
5. Site opens with cursor hover

I'll do the first one for you and then maybe you might like to figure out the others from here? - https://github.com/Aris-t2/CustomCSSforFx

Code: Select all

/*Franks quick round corner tabs...*/
    tab {
    border-top-right-radius: 10px !important ;
    border-top-left-radius: 10px !important; } 

[AndrewAM]

I'm hoping someone will write an extension to move the tab bar below the bookmarks bar.

[Frank Lion]

I'm hoping someone will write an extension to move the tab bar below the bookmarks bar.

Because of changes that began with Firefox 57, that is very unlikely to happen. UI affecting extensions are a thing of the past.

[AndrewAM]

I'm hoping someone will write an extension to move the tab bar below the bookmarks bar.

Because of changes that began with Firefox 57, that is very unlikely to happen. UI affecting extensions are a thing of the past.

Why not an extension, or a tool, to simply install the desired code into the userChrome.css file, in the right place, along with the ability to undo it?

[Frank Lion]

I'm hoping someone will write an extension to move the tab bar below the bookmarks bar.

Because of changes that began with Firefox 57, that is very unlikely to happen. UI affecting extensions are a thing of the past.

Why not an extension, or a tool, to simply install the desired code into the userChrome.css file, in the right place, along with the ability to undo it?

I've already told you why not -

Because of changes that began with Firefox 57, that is very unlikely to happen. UI affecting extensions are a thing of the past

It is now up to you to research this subject yourself, if you want to pursue this.

[AndrewAM]

Why not an extension, or a tool, to simply install the desired code into the userChrome.css file, in the right place, along with the ability to undo it?

I've already told you why not -
Because of changes that began with Firefox 57, that is very unlikely to happen. UI affecting extensions are a thing of the past
It is now up to you to research this subject yourself, if you want to pursue this.

It's now up to me to use a userChrome.css file to do any customization. I've gone down that sort of rabbit hole before, spending all kinds of time to make things a bit better. Don't think I will this time, too much typing, experimenting, finding typos or other mistakes, consulting people around here, etc.

Stlll don't see why a batch file, or a "use once" extension (there still are some extensions, aren't there?) couldn't insert the appropriate code in the appropriate userChrome.css file in the right place. This wouldn't affect the UI directly, simply alter the userChrome.css file. But since I've already been told why not, I'll just get used to the tab bar where it is.

[CaJazzman]

Why not an extension, or a tool, to simply install the desired code into the userChrome.css file, in the right place, along with the ability to undo it?

I've already told you why not -
Because of changes that began with Firefox 57, that is very unlikely to happen. UI affecting extensions are a thing of the past
It is now up to you to research this subject yourself, if you want to pursue this.

It's now up to me to use a userChrome.css file to do any customization. I've gone down that sort of rabbit hole before, spending all kinds of time to make things a bit better. Don't think I will this time, too much typing, experimenting, finding typos or other mistakes, consulting people around here, etc.

Stlll don't see why a batch file, or a "use once" extension (there still are some extensions, aren't there?) couldn't insert the appropriate code in the appropriate userChrome.css file in the right place. This wouldn't affect the UI directly, simply alter the userChrome.css file. But since I've already been told why not, I'll just get used to the tab bar where it is.

AndrewAM, try this code for your UserChrome.css file.

Code: Select all

/* Firefox userChrome.css */

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

/* FILL BOOKMARK FOLDERS WITH GIVEN COLOUR */
/* THIS ALSO WORKS WHEN USING "Show All Bookmarks" */
.bookmark-item[container], treechildren::-moz-tree-image(container) {
  fill: orange !important;
}

/* tabs on bottom */
#navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar) {-moz-box-ordinal-group:10}
#toolbar-menubar .toolbarbutton-text { display: block !important; }
#nav-bar .toolbarbutton-text { display: block !important; }
/* Search Bar width */
.searchbar-textbox {
max-width: 500px !important;
min-width: 300px !important; }
 .tab-background {
border-radius: 16px 16px 0px 0px !important;
border-image: none !important; }

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

It might be what you are wanting.