Question

Firefox: Show tabs below - that's how it works

Answer 1

Show Firefox tabs below the address bar
1st step:
2nd step:
3rd step:
4th step:
5th step:
6th step:
Code for the userChrome.css file
quick start Guide

---

Would you prefer to see the tabs open in Firefox below the address bar? It's easy to do with this trick..

In the past, the tabs in Mozilla Firefox were always displayed below the address bar and toolbar. However, that changed with an update a few years ago. When opening a new tab, it is always displayed at the top of the browser. If you liked the old view better, that's no problem: with a few clicks you can pin the tabs at the bottom.

Show Firefox tabs below the address bar

Follow our step-by-step instructions or take a look at the brief instructions .

1st step:

Use the key combination [Windows] + [R] to open the Run window and enter " % appdata% " (without quotation marks).

2nd step:

Then open the " Mozilla " folder , then " Firefox " and then " Profiles ". As a rule, there is only one additional single folder with a somewhat cryptic name. This is the profile that Firefox created for you. Open this folder as well. If there is already a " chrome " folder there, open it. Otherwise, simply create a folder with this name by right-clicking and then " New " and " Folder ".

3rd step:

If there is a file called " userChrome.css " in the " chrome " folder , open it for editing. Otherwise, you'll have to create them. To do this, check the " View " tab for " File name extension ". Then right-click " New " and create a " text file ". Delete the complete name including the ending .txt and replace it with " userChrome.css ".

4th step:

Then enter the code shown in the next section . It is designed for the current Firefox version (version 90) using Windows 10. Save the file after editing. You can then close it.

5th step:

Then you have to open Firefox and enter " about: config " in the address line. You may still need to confirm that you really want to access these settings. You will find the option " toolkit.legacyUserProfileCustomizations.stylesheets " in the settings. You may have to search for this option first because it is not displayed directly. Then set it to " true " by clicking the arrow symbol on the right.

6th step:

Now all you have to do is restart Firefox completely . The tabs will then be displayed again below the address bar.

Code for the userChrome.css file

#TabsToolbar {
position: absolute;
display: block;
bottom: 0;
width: 100vw;
background-clip: padding-box;
color: var(--toolbar-color);
}
#tabbrowser-tabs {
width: 100vw;
}
#navigator-toolbox {
position: relative;
padding-bottom: calc( var(--tab-min-height) + 8px );
}
#main-window[tabsintitlebar][sizemode="maximized"]:not([inDOMFullscreen="true"]) #titlebar {
height: 36px;
}
.titlebar-buttonbox-container {
position: fixed;
right: 0;
visibility: visible;
display: block;
}
#TabsToolbar .titlebar-buttonbox-container,
#TabsToolbar #window-controls {
display: none;
}

quick start Guide

1. Go to the following file path to " C: \ Users \ {username} \ AppData \ Roaming \ Mozilla \ Firefox \ Profiles \ [profile folder] ".
2. In your profile folder there should be a " chrome " folder with a file called " userChrome.css ". If not, create both. Then open it for editing and copy and paste the code above .
3. After saving the file, you now have to change a setting in Firefox itself. To do this, call up the appropriate settings by entering " about: config " in the address line.
4. Set the option " toolkit.legacyUserProfileCustomizations.stylesheets " to " true " and restart Firefox. Your tabs will then be displayed again below.

---