5

I've started using Tree Style Tab on Firefox. It's a great solution for cases where you have many, many tabs and you want to add some level of organization to it.

It's becoming increasingly unnecessary to have the list of tabs on the top of my browser.

Is it possible to hide the list of tabs at the top of the browser?

  • I highly recommend this to anyone. It's such a better, simpler browsing experience. – Cauder Apr 12 at 2:47
3

To hide the native tabs, you'll have to add a new file called userChrome.css and the css property visibility: collapse.

To do this, in Firefox click on Click on Menu -> Help -> Troubleshooting Information or navigate to about:support in the address bar.

Under the Application Basics section, there will be a section called Profile Directory with a button to Open Directory.

In the Profile Directory create a new folder called chrome. In the chrome folder create or edit the file userChrome.css if it already exists.

The contents of userChrome.css should be the following.

/* hides the native tabs */
#TabsToolbar {
  visibility: collapse;
}

Some optional further modifications to put in userChrome.css are:

/* hides the title bar */
#titlebar {
  visibility: collapse;
}

/* hides the sidebar */
#sidebar-header {
  visibility: collapse !important;
} 

A configuration that Xilin Sun uses is:

/* hides the native tabs */
#TabsToolbar {
  visibility: collapse;
}
/* leaves space for the window buttons */
#nav-bar {
    margin-top: -8px;
    margin-right: 74px;
    margin-bottom: -4px;
}

Try these out and see what you think looks best.

To answer your question in the comment, you may like this option better. I tried using visibility, but it was extremely flashy and jittery with the hover.

/* Option 1 */
#TabsToolbar {
    opacity: 0.0;
}

#TabsToolbar:hover {
    opacity: 1.0;
}

/* Option 2 */
#TabsToolbar {
    visibility: collapse;
}

#navigator-toolbox:hover #TabsToolbar {
    visibility: visible;
}
  • Thanks! This looks great. Just curious, why is there a folder called Chrome in Firefox? – Cauder Apr 12 at 1:12
  • @Cauder I'm not sure, I was wondering the same thing. You could try to rename it and see if it still works. – DrZoo Apr 12 at 1:14
  • Interesting, looks like there's no relationship with Google Chrome. nngroup.com/articles/browser-and-gui-chrome – Cauder Apr 12 at 1:27
  • Is there any way I can switch back and forth? I tried it out and I realized it's nice when I have lots of tabs, but when I have few tabs I like to have the list available at the top of the window. – Cauder Apr 12 at 2:37
  • @Cauder which contents did you put in your userChrome.css file? – DrZoo Apr 12 at 3:13

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.