Customising Firefox 3

If, like me you have recently upgraded to Firefox 3 and you have spent years using Tabbed Browser Preferences to manage your tabs position in the window, colour, order etc etc, then you, like me, are quite disappointed with the lack of configuration the tab bar has within Firefox 3.

Developer Comments: This extension is an enhancement for the basic tab controls provided in Firefox 1.0. It replaces the existing user interface with a new, more visible user interface, and also includes UI for other hidden features that are part of the browser, as well as features provided explicitly by the extension.

Tabbrowser Prefs is not currently available for Firefox 3 on Windows or Linux, which left me feeling frustrated. I would love to have felt annoyed, but can you really be annoyed when the info to build your very own plugin is out there?

I decided I had to do something. I had to have my tab bar on the bottom of the window at least. So, I went off and researched it.

After about 5 minutes I found out that the main interface to Firefox is controlled entirely by CSS. This is perfect. I located the CSS style sheet, googl’d some more and found the CSS variables needed to modify the interface settings. So now I am going to share it with everyone of you.

Open up nautilus and show hidden files. then navigate to:

1. /home/.mozilla/firefox/your.profile/chrome

By default userChrome.css fie does not exist, so you need to create it before you can start adding your preferences. There’s actually an example file that exists by default, called userChrome-example.css. You can just rename that file by removing the -example part. Then open this file in leaf/mouse pad or any other text editor and add the following code and save it.

1. /* Display the tabbar at the bottom */ #content > tabbox { -moz-box-direction: reverse; }

Open up My Computer or File Explorer and show hidden files. then navigate to:

1. C:\Documents andSettings\[UserName]\ApplicationData\Mozilla\Firefox\Profiles\your.proifile\chrome

By default userChrome.css fie does not exist, so you need to create it before you can start adding your preferences. There’s actually an example file that exists by default, called userChrome-example.css. You can just rename that file by removing the -example part. Then open this file in notepad or any other text editor and add the following code and save it.

1. /* Display the tabbar at the bottom */ #content > tabbox { -moz-box-direction: reverse; }