3

Firefox 3.6.8 on Ubuntu 9.10; using TreeStyleTab 0.10.2010040201.

I use the tab-bar on the right, and I would like to see more of the tab names without widening the bar. The default font used is Sans, I believe; I would like to use something like condensed DejaVu Sans. I haven't found anything in the settings, nor in the about:config page, so I presume I can play some .css trick, but I don't know where to start.

How can I do this change?

1
  • @Javier: I'm sorry I rolled back your edit, but I believe it is important that this is an extension-related question; I'm looking for a specific answer hopefully by someone with the same extension installed; the generic answer by e.g. koushik, although correct, is not an actual answer to my question. Sep 6, 2010 at 23:13

2 Answers 2

4

Install Stylish extension:

https://addons.mozilla.org/en-US/firefox/addon/2108/

Then add this script:

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

.tabbrowser-tabs .tab-text {
 font-size: 4mm !important;
 font-family: Condensed DejaVu Sans !important;
 font-weight: bold !important;
 color: #ffffff !important;
 text-shadow: 0 0px 2px rgba(0,0,0,2),
        0 0 1px rgba(0, 0, 0,1) !important;
}

Change options to your linking.

It will look like this:

alt text

4
  • I already tried similar changes to userChrome.css; the TreeStyleTab extension does not follow tabbrowser-tabs styles; but thanks, anyway. Oct 10, 2010 at 23:27
  • I use Tree Style Tabs and the picture above was taking from my screen. It works. Oct 11, 2010 at 0:22
  • It works, thanks. I just added it to userChrome.css instead of installing Stylish.
    – cysiek10
    Feb 19, 2012 at 6:44
  • And if you also want to increase the tab height, add this: pastebin.com/HqRFUjcv (the CSS class duplication is important to raise the specificity of this rule).
    – RomanSt
    Feb 11, 2014 at 17:04
3

You can tweak firefox UI fonts, colors etc by editing the userchrome.css file. The process is explained with a long list of snippets for "common" tweaks here. Or if u just want to tweak the font, you can check this is a short tutorial.

As per the official mozilla howto

Neither userChrome.css nor userContent.css exist by default. If you want them, you create them in the chrome subdirectory underneath the user's profile directory. userChrome.css controls CSS for the UI chrome of the Mozilla application; userContent.css controls CSS for content inside windows.

1
  • So I guess I have to search in the firefox/extensions/[email protected]/chrome/treestyletab.jar and locate the relevant .css file in order to find which setting might be the one and edit my userChrome.css (yes, I've created that one a long time ago). I was hoping to get a more specific answer, but thanks for answering anyway. Sep 6, 2010 at 20:52

Not the answer you're looking for? Browse other questions tagged .