X
Tap here to go to the mobile version of the site.

Support Forum

This thread was closed and archived. Please ask a new question if you need help.

Moving the tabs below the menu toolbar in Firefox 57

Posted

I want to move the tabs below the menu toolbar in Firefox 57 like it was in v 56. That's the main reason I don't use Chrome.

I want to move the tabs below the menu toolbar in Firefox 57 like it was in v 56. That's the main reason I don't use Chrome.

Chosen solution

You need to create a userChrome.css file before you can move the tabs below the address bar, here's a site that shows you how.

After doing that, put this into userChrome.css

/* Tab bar below Navigation & Bookmarks Toolbars

  For best results, show Title Bar or Menu Bar */
  #nav-bar { /* main toolbar */
  -moz-box-ordinal-group: 1 !important;
  border-top-width: 0 !important; 
   }
    #PersonalToolbar { /* bookmarks toolbar */
   -moz-box-ordinal-group: 2 !important;
   }
   #TabsToolbar { /* tab bar */
 -moz-box-ordinal-group: 3 !important;
   }
Read this answer in context 16

Additional System Details

Installed Plug-ins

  • Shockwave Flash 27.0 r0

Application

  • User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:57.0) Gecko/20100101 Firefox/57.0

More Information

Moses
  • Moderator
459 solutions 3607 answers

Chosen Solution

You need to create a userChrome.css file before you can move the tabs below the address bar, here's a site that shows you how.

After doing that, put this into userChrome.css

/* Tab bar below Navigation & Bookmarks Toolbars

  For best results, show Title Bar or Menu Bar */
  #nav-bar { /* main toolbar */
  -moz-box-ordinal-group: 1 !important;
  border-top-width: 0 !important; 
   }
    #PersonalToolbar { /* bookmarks toolbar */
   -moz-box-ordinal-group: 2 !important;
   }
   #TabsToolbar { /* tab bar */
 -moz-box-ordinal-group: 3 !important;
   }
You need to create a userChrome.css file before you can move the tabs below the address bar, here's a site that shows you how. *https://www.userchrome.org/how-create-userchrome-css.html After doing that, put this into userChrome.css /* Tab bar below Navigation & Bookmarks Toolbars For best results, show Title Bar or Menu Bar */ #nav-bar { /* main toolbar */ -moz-box-ordinal-group: 1 !important; border-top-width: 0 !important; } #PersonalToolbar { /* bookmarks toolbar */ -moz-box-ordinal-group: 2 !important; } #TabsToolbar { /* tab bar */ -moz-box-ordinal-group: 3 !important; }

Question owner

Do I place all of the code?

/* Tab bar below Navigation & Bookmarks Toolbars

 For best results, show Title Bar or Menu Bar */
 #nav-bar { /* main toolbar */
 -moz-box-ordinal-group: 1 !important;
 border-top-width: 0 !important; 
  }
   #PersonalToolbar { /* bookmarks toolbar */
  -moz-box-ordinal-group: 2 !important;
  }
  #TabsToolbar { /* tab bar */
-moz-box-ordinal-group: 3 !important;
  }

Or just

For best results, show Title Bar or Menu Bar */
 #nav-bar { /* main toolbar */
 -moz-box-ordinal-group: 1 !important;
 border-top-width: 0 !important; 
  }
   #PersonalToolbar { /* bookmarks toolbar */
  -moz-box-ordinal-group: 2 !important;
  }
  #TabsToolbar { /* tab bar */
-moz-box-ordinal-group: 3 !important;
  }
Do I place all of the code? /* Tab bar below Navigation & Bookmarks Toolbars For best results, show Title Bar or Menu Bar */ #nav-bar { /* main toolbar */ -moz-box-ordinal-group: 1 !important; border-top-width: 0 !important; } #PersonalToolbar { /* bookmarks toolbar */ -moz-box-ordinal-group: 2 !important; } #TabsToolbar { /* tab bar */ -moz-box-ordinal-group: 3 !important; } Or just For best results, show Title Bar or Menu Bar */ #nav-bar { /* main toolbar */ -moz-box-ordinal-group: 1 !important; border-top-width: 0 !important; } #PersonalToolbar { /* bookmarks toolbar */ -moz-box-ordinal-group: 2 !important; } #TabsToolbar { /* tab bar */ -moz-box-ordinal-group: 3 !important; }
Moses
  • Moderator
459 solutions 3607 answers

Both code snippets you posted are the same minus some formatting. Copy / paste all the code in my initial reply into userChrome.css then restart Firefox.

Both code snippets you posted are the same minus some formatting. Copy / paste all the code in my initial reply into userChrome.css then restart Firefox.
AnotherDesign 0 solutions 6 answers

Helpful Reply

When I use this code in userChrom.css, the address bar moves to the top of the window. With it moves the Back and Forward buttons. On a Mac these buttons are then UNDER the Red close window button, and Orange reduce button. Is it possible to move or loose these Back & Forward buttons?. I have tried Customising with a Flexible Space to move the m away from the corner, but it didn't work.

When I use this code in userChrom.css, the address bar moves to the top of the window. With it moves the Back and Forward buttons. On a Mac these buttons are then UNDER the Red close window button, and Orange reduce button. Is it possible to move or loose these Back & Forward buttons?. I have tried Customising with a Flexible Space to move the m away from the corner, but it didn't work.

Question owner

Moses, Thanks for your help. I created a text file and named it with a .css extension. I created a new css file with that extension in the title and it worked.

57 is wicked fast.

Moses, Thanks for your help. I created a text file and named it with a .css extension. I created a new css file with that extension in the title and it worked. 57 is wicked fast.
ThinkforSky 0 solutions 1 answers

Hi, I downloaded a prepared .css file from a german page and later I deleted it and created a .css-file with your instructions from this thread.

But with both solutions I had the same problems:

with the .css-file I can not restore old sessions anymore, it's completly gone. Also when the browser opens, I see the starting page only a short time, then it changes to a white page :-(

Any idea how to solve this? I really, really would like to have my tabs down.. Thanks for your help!

Hi, I downloaded a prepared .css file from a german page and later I deleted it and created a .css-file with your instructions from this thread. But with both solutions I had the same problems: with the .css-file I can not restore old sessions anymore, it's completly gone. Also when the browser opens, I see the starting page only a short time, then it changes to a white page :-( Any idea how to solve this? I really, really would like to have my tabs down.. Thanks for your help!

Modified by ThinkforSky

Moses
  • Moderator
459 solutions 3607 answers

ThinkforSky:

Make sure the file extension is .css and not .css.txt.

ThinkforSky: Make sure the file extension is <b>.css </b> and not .css.txt. *https://www.userchrome.org/what-is-userchrome-css.html
Roostersec 0 solutions 1 answers

I have followed all the steps to the best of my abilities. I have created the "chrome" folder in the profile being used by Firefox. I have entered the code into the chrome folder. Nothing has changed. Any idea as to what I am doing wrong?

I have followed all the steps to the best of my abilities. I have created the "chrome" folder in the profile being used by Firefox. I have entered the code into the chrome folder. Nothing has changed. Any idea as to what I am doing wrong?
Moses
  • Moderator
459 solutions 3607 answers

Can you send through a screenshot of the contents of your chrome folder and what you entered into userChrome.css?

Can you send through a screenshot of the contents of your chrome folder and what you entered into userChrome.css?
Moses
  • Moderator
459 solutions 3607 answers

Roostersec: Actually, please create a new thread with those screenshots and PM me the link. I'll be closing this thread since the OP has already marked this as solved. For future reference, hijacking threads even if on the same subject is not allowed per forum rules and guidelines.

Roostersec: Actually, please create a new thread with those screenshots and PM me the link. I'll be closing this thread since the OP has already marked this as solved. For future reference, hijacking threads even if on the same subject is not allowed per forum rules and guidelines.