4 Handy Firefox userchrome.css Modifications

February 1, 2009 at 2:29 pm 1 comment

These instructions are for Firefox 3.

The four modifications we are going to perform today are:

  • Expand the bookmark bar into multiple rows.
  • Install easy Firefox restart add-on
  • Install Firefox add-on to create multiple tab rows
  • Move tab row to screen bottom

Multiple Bookmark Rows

1. First, find your userchrome.css file by way of one of the following paths:

  • Windows 2000/XP
    C:\Documents and Settings\[USER]\Application Data\Mozilla\Firefox\Profiles\default.tea\chrome\
  • Windows Vista
  • Mac OS X
    ~/Library/Application Support/Firefox/Profiles/[profile-name]/chrome/

2. If it says “userchrome-example.css” simple re-name it to “userchrome.css”.

3. Open userchrome.css in Notepad.

4. Insert the following code, thanks to a fluctuation.

/* Multi-row bookmarks toolbar for Firefox 3*/
{display:block !important;}
{display:block !important;
height: 50px !important;
overflow-y:auto !important;}
#bookmarksBarContent toolbarseparator
{display:inline !important;}
#bookmarksBarContent .bookmark-item
{visibility: visible !important;}
.chevron {height: 0px !important;}

5. Save userchrome.css, and restart Firefox.  You may have to adjust “height: 50px” unless you are using the Default Firefox theme.

Firefox Re-Start Add-on

To make step 5 of the previous instructions easier, I suggest downloading this add-on:  QuickRestart.

This add-on adds a “Restart Firefox” selection in your File menu.  It can also be triggered by Ctrl+Alt+R. Very quick, and very handy! 🙂

Firefox Multiple Tab Rows Add-on

To increase productivity by being able to view all your tabs at once, consider downloading this add-on: Multiple Tab Handler.

Besides immediately producing multple tab rows, it includes the functions of drag and drop, multiple selection and grouping.

Place Tab Rows on Screen Bottom

1. Once again, open your userchrome.css file in Notepad.

2.  Add this code, thanks to Mark O’Neill.

/* Display the Tab bar at the bottom */
#content > tabbox { -moz-box-direction: reverse; }

Thanks! I hope you found these useful! Once you know where the userchrome.css file is, there are many, many modifications you can make, and they’re only a Google search away 😉


Entry filed under: technology, Thoughts/Comments/Ideas. Tags: , , , , , , , , .

40 Brilliant Photoshopped Print Ads Why yes, I have been neglecting my blog lately!!

1 Comment Add your own

  • 1. Neville Dharmawansa  |  May 20, 2009 at 9:10 am

    the tweak of putting the tab bar at the bottom did not work for me.I am using FF 3.0.10 Have I done something wrong? Can you kindly give me all the steps again?



Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s

Trackback this post  |  Subscribe to the comments via RSS Feed

About the Author

Stephanie Scharf currently resides in Lincoln, NE. She attends the University of Nebraska-Lincoln and is studying Advertising with an emphasis on graphic and web design. Her time is split between working on school and client projects, hangin' with friends, and "geeking out" by reading up on the latest in web and social media trends. For more information, please visit the About page.

Please e-mail Stephanie your suggestions of topics you'd like to see on this blog!

Subscribe & Share

Bookmark and Share

Visit My Website!

Hosting my Portfolio and complete list of Design Services!

Recent Twitterings

February 2009
« Jan   Mar »

Visitor Count

  • 139,409 hits

%d bloggers like this: