title: Firefox hides horizontal tabs and changes them to vertical tabs
date: 2023-12-18
coverurl:
type: Post
slug: ff-hide-tab
stats: Published
category: Technical Sharing
summary:
icon: fa-solid fa-camera
password:
tags:
- firefox
notionID: eec1b657-f5be-41ca-b58e-3c7d1b90d735
link: https://spiffy-hardware-dff.notion.site/Firefox-eec1b657f5be41cab58e3c7d1b90d735
I really like the vertical tabs in Edge, as they can display more content. Firefox can also achieve this effect using plugins.
Effect Image#
Tools Needed#
- Firefox browser
- sidebery plugin
- userChrome.css
Enable Firefox's Custom CSS feature#
- Enter
about:configin the address bar and press Enter - Confirm the risk prompt
- Enter
stylesheetsin the search bar - Find
toolkit.legacyUserProfileCustomizations.stylesheetsand double-click to set it totrue
Configure CSS file#
You need to create a new CSS file in the configuration file, which is not easy to find
- Enter
about:supportin the address bar - Find the
Profile Folderoption, then clickOpen Folder - Create a new folder in the current folder named
chrome - Create a new file in the
chromefolder nameduserChrome.css - Open
userChrome.cssand paste the following content
#TabsToolbar {
visibility: collapse;
}
#sidebar-header {
visibility: collapse !important;
}
User-friendly configuration#
After the above configuration, there are two problems:
- There is no maximize, minimize, and close buttons
This can be solved by using shortcuts - It is not easy to move the window
You can add aFlexible Spacein theCustomize Toolbaroption on the toolbar, which can also solve the problem of double-clicking to maximize and minimize. However, the space looks a bit ugly, and I don't know how to make it shorter.
Enjoy!#
FF Android mobile can also use plugins. Although FF is already considered as others, it doesn't matter, I still like it.