Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Moving webite tabs below bookmarks

  • 3 replies
  • 1 has this problem
  • 15 views
  • Last reply by sparrowfox

more options

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 👍 1

All Replies (3)

more options

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?

Helpful?

more options

You can possibly try the code posted in the thread.

You may have to adjust some of the vars that are defined at the start of the code.

Helpful?

more options

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 by sparrowfox

Helpful?

Ask a question

You must log in to your account to reply to posts. Please start a new question, if you do not have an account yet.