DEV Community

Miguel Pimentel
Miguel Pimentel

Posted on • Updated on • Originally published at miguelpimentel.do

Unlock the Sidebar Width in Firefox

Why Would Anyone Want to Do This?

  • To enhance the use of the Firefox Side View extension.
  • To compliment the use of one of my Firefox sidebar extensions.

Step-by-Step Instructions

1) In a new tab, navigate to about:support.
2) Under Application Basics, find Profile Folder.
3) Locate and click the Open Folder button next to it. It will be next to an address similar to: %appdata%\Mozilla\Firefox\Profiles\{profile-id}.default 1
4) Inside your Firefox Profile Folder, create a new folder named: chrome.
5) Inside the newly created chrome folder, create a new file named: userChrome.css.
6) Copy the following code 2, paste as content and save: 3

#sidebar-box {
  max-width: 40% !important;
  min-width: 300px !important;
}
Enter fullscreen mode Exit fullscreen mode

7) Finally, in a new tab, navigate to about:config, search for toolkit.legacyUserProfileCustomizations.stylesheets, and change its value to true.
8) Restart Firefox and test it out!


  1. %appdata% is equivalent to C:\Users\{username}\AppData\Roaming 

  2. After Firefox 107, #sidebar was deprecated, and #sidebar-box was introduced. 

  3. You may change the units to any length you find more convenient. 

Top comments (0)