Forum Response - Tabs below the URL bar

<!-- The first paragraph and the Note below it provide general information about userChrome.css files. --> Firefox's style or appearance can be [https://developer.mozilla.org/en-US/docs/Mozilla/Tech/XUL/Tutorial/Modifying_the_Default_Skin modified] by creating a '''chrome''' folder inside your [[Profiles - Where Firefox stores your bookmarks, passwords and other user data|Firefox profile folder]] and then placing a '''userChrome.css''' file inside, that includes a custom style rule. The rules you put in the userChrome.css file will override the default styles in Firefox. '''''Note:''' Custom style rules might not work every time because of other factors (such as incompatibility with other custom style rules) beyond the Mozilla community's control. Your custom style rule might also stop working each time a new Firefox release comes out. Here's how to modify Firefox so that tabs are shown below the address (URL) bar instead of at the top: '''If your Firefox profile folder already has a chrome folder containing userChrome.css''':<br> Go to https://www.userchrome.org/what-is-userchrome-css.html and copy the CSS rules under the "Move the Tab Bar Below the Other Toolbars" example [https://www.userchrome.org/what-is-userchrome-css.html#movetabbar here] into your userChrome.css file. After saving your changes and closing the file, you should [[Customize Firefox controls, buttons and toolbars|turn on your Firefox title bar]] or menu bar on Windows. (The CSS rules you copied include other suggestions as comments.) '''Otherwise, follow these instructions''':<br> (See [https://www.userchrome.org/how-create-userchrome-css.html this help page] and our [https://vimeo.com/242513527 community member's video starting at 8:45] for more information.) #Open your currently active profile folder: Type '''about:support''' in the Firefox address bar and, under the "Application Basics" section next to "Profile Folder", click '''Open Folder''' (Windows) '''Open Directory''' (Linux) or '''Show in Finder''' (Mac). #*'''On Mac''', a folder will open that contains your profile folder. Open the selected profile folder (it will be named something like ''xxxxxxxx.default'' for a default profile). #Create a new folder named '''chrome''' inside the profile folder. #*Create a desktop shortcut to the '''chrome''' folder, if you wish, for easier future access. #Download and save this file, then move it into that chrome folder:<br>https://www.userchrome.org/samples/userChrome-tabs_on_bottom.css #Rename the file, from "userChrome-tabs_on_bottom.css" to '''userChrome.css''' #*'''Important''': If the file you saved was named "userChrome-tabs_on_bottom" (the .css was missing) that means Windows is set to hide file name extensions. Either [https://www.bleepingcomputer.com/tutorials/how-to-show-file-extensions-in-windows/ set Windows to show file name extensions] before renaming the file or else rename the file '''userChrome''' (so that you don't end up with a "userChrome.css.css" file that won't work).<!-- https://support.mozilla.org/en-US/questions/1189654#answer-1038747 --> #Restart Firefox, which will discover that file and apply the rules. '''Tip:''' [[Customize Firefox controls, buttons and toolbars|Turn on your title bar]], or the menu bar on Windows, after you've made these changes.

Firefox's style or appearance can be modified by creating a chrome folder inside your Firefox profile folder and then placing a userChrome.css file inside, that includes a custom style rule. The rules you put in the userChrome.css file will override the default styles in Firefox.

Note: Custom style rules might not work every time because of other factors (such as incompatibility with other custom style rules) beyond the Mozilla community's control. Your custom style rule might also stop working each time a new Firefox release comes out.

Here's how to modify Firefox so that tabs are shown below the address (URL) bar instead of at the top:

If your Firefox profile folder already has a chrome folder containing userChrome.css:
Go to https://www.userchrome.org/what-is-userchrome-css.html and copy the CSS rules under the "Move the Tab Bar Below the Other Toolbars" example here into your userChrome.css file. After saving your changes and closing the file, you should turn on your Firefox title bar or menu bar on Windows. (The CSS rules you copied include other suggestions as comments.)

Otherwise, follow these instructions:
(See this help page and our community member's video starting at 8:45 for more information.)

1. Open your currently active profile folder: Type about:support in the Firefox address bar and, under the "Application Basics" section next to "Profile Folder", click Open Folder (Windows) Open Directory (Linux) or Show in Finder (Mac).
   • On Mac, a folder will open that contains your profile folder. Open the selected profile folder (it will be named something like xxxxxxxx.default for a default profile).
2. Create a new folder named chrome inside the profile folder.
   • Create a desktop shortcut to the chrome folder, if you wish, for easier future access.
3. Download and save this file, then move it into that chrome folder:
   https://www.userchrome.org/samples/userChrome-tabs_on_bottom.css
4. Rename the file, from "userChrome-tabs_on_bottom.css" to userChrome.css
   • Important: If the file you saved was named "userChrome-tabs_on_bottom" (the .css was missing) that means Windows is set to hide file name extensions. Either set Windows to show file name extensions before renaming the file or else rename the file userChrome (so that you don't end up with a "userChrome.css.css" file that won't work).
5. Restart Firefox, which will discover that file and apply the rules.

Tip: Turn on your title bar, or the menu bar on Windows, after you've made these changes.