
Moving webite tabs below bookmarks
Last time Firefox updated, I managed to find information online about moving the website tabs so they were below the bookmarks instead of at the top of the screen. It was a huge pain-in-the-butt to do.
After a recent re-install, the tabs have moved themselves back to the top of the screen and nothing I do seems to be able to move them back below the bookmarks.
Is there a way I can move the tabs that doesn't involve spending hours hunting through posts on the web, changing hidden Firefox settings, and recoding .css files?
If not, why do you not give the option to move the tabs wherever the user wants? Especially when it makes far more sense to have the website tabs directly above the website being viewed, at least in my opinion?
I'm currently using Firefox 85.0.2 (64-bit).
Chosen solution
Normally when you reinstall Firefox it simply picks up your existing settings. Did Firefox indicate that it couldn't use your existing settings and needed to create a new profile?
I'm asking because:
You already know that you need to use a userChrome.css file for this project. If you still have the files from your old profile, you can just copy/paste the chrome folder from your old profile into your new one, set one preference, and then restart Firefox.
But if you are starting from scratch, it's not going to take hours. Here's how you do it:
(A) Download the style code
There are many possible sources. I have some files here:
https://www.userchrome.org/what-is-userchrome-css.html#movetabbar
After downloading, use the downloads list on the toolbar to open the downloads folder directly to the new userChrome.css file. (See attached example screenshot)
Minimize that file browser window for later reference.
If you already have a userChrome.css file, the rules in this file can be added to your existing file. If you do not already have a userChrome.css file, please continue.
(B) Create a new chrome
folder in your profile folder
The following article has the detailed steps for that (#1, #2, and I recommend #3)
https://www.userchrome.org/how-create-userchrome-css.html
I have videos for both Windows and Mac in case the text is not clear.
(C) Move the file you downloaded in Step A into the chrome
folder you created in Step B
You can drag and drop between the two file browser windows, or use right-click > Copy in the source window and then right-click > Paste a blank area in the destination window.
(D) Rename the file to userChrome.css
Right-click the file and choose Rename. Then delete the -tabs_on_bottom_Fx74-80_WindowsLinux
part so the file name ends up being userChrome.css.
(E) Set Firefox to look for userChrome.css at startup -- see step #6 in the above article.
The next time you exit Firefox and start it up again, it should discover that file and apply the rules.
Success?
Read this answer in context 👍 1All Replies (3)
Chosen Solution
Normally when you reinstall Firefox it simply picks up your existing settings. Did Firefox indicate that it couldn't use your existing settings and needed to create a new profile?
I'm asking because:
You already know that you need to use a userChrome.css file for this project. If you still have the files from your old profile, you can just copy/paste the chrome folder from your old profile into your new one, set one preference, and then restart Firefox.
But if you are starting from scratch, it's not going to take hours. Here's how you do it:
(A) Download the style code
There are many possible sources. I have some files here:
https://www.userchrome.org/what-is-userchrome-css.html#movetabbar
After downloading, use the downloads list on the toolbar to open the downloads folder directly to the new userChrome.css file. (See attached example screenshot)
Minimize that file browser window for later reference.
If you already have a userChrome.css file, the rules in this file can be added to your existing file. If you do not already have a userChrome.css file, please continue.
(B) Create a new chrome
folder in your profile folder
The following article has the detailed steps for that (#1, #2, and I recommend #3)
https://www.userchrome.org/how-create-userchrome-css.html
I have videos for both Windows and Mac in case the text is not clear.
(C) Move the file you downloaded in Step A into the chrome
folder you created in Step B
You can drag and drop between the two file browser windows, or use right-click > Copy in the source window and then right-click > Paste a blank area in the destination window.
(D) Rename the file to userChrome.css
Right-click the file and choose Rename. Then delete the -tabs_on_bottom_Fx74-80_WindowsLinux
part so the file name ends up being userChrome.css.
(E) Set Firefox to look for userChrome.css at startup -- see step #6 in the above article.
The next time you exit Firefox and start it up again, it should discover that file and apply the rules.
Success?
You can possibly try the code posted in the thread.
- /questions/1305615 tabs below address bar - an ongoing problem not fixed !!!
You may have to adjust some of the vars that are defined at the start of the code.
Thank you so much, jscher2000!
Unfortunately, there was file corruption involved, so I couldn't reuse my old profile (in fact, I couldn't even find it). I spent a bunch of time going through suggested solutions, none of which worked. It had been years since the last time I needed to do this and there was a lot of out-dated info out there that just didn't work.
Your solution worked great!
If only every question I asked online was answered in such a timely, accurate, and polite manner.
I really appreciate it. Thank you kindly!
Modified