How do I keep firefox from using drop-shadows on unselected tabs? Once I started using personas, the inactive tabs all have shadows under their text that reduce their readability.


I noticed this while using the Tree Style Tab add-on with Firefox 4, and solved it by adding the following to my userChrome.css file:

.tabbrowser-tab { text-shadow: none !important; }

This file is located in the chrome/ folder of your profile. If one doesn't already exist, you'll want to copy the corresponding example file and edit it accordingly.

Not sure if that style is specific to Tree Style Tab, or a generic XUL style used by Firefox, but it's worth a shot.

| improve this answer | |
  • I will try this once I upgrade to firefox 4. – K Robinson Mar 27 '11 at 1:47

I found a clean and easy answer over there : https://userstyles.org/styles/66809/firefox-chrome-no-tab-text-shadow, just follow instructions, takes at least five seconds.

This problem of shadowed text in tabs is really a pain in... when you are using a lot of tabs !

In case of the link would die :

Install Stylish addon. Use this snippet :

.tabbrowser-tabs .tab-text { color: black; text-shadow: none; }

#TabsToolbar * { color: black; text-shadow: none; }

Many thanks to 'unmacaque' for this !

| improve this answer | |
  • Nice, basically works. However, you may not want to override a specific theme's text color. I just left out the color: black part and it works quite nicely. – Cedric Reichenbach May 19 '16 at 8:03
  • I agree, the solution I found is a bit heavy. Thanks for sharing yours :) – Benj May 19 '16 at 10:05
.tabbrowser-tab { text-shadow: none !important; }

This works perfectly to disable all text shadows in FF4 and FF5

| improve this answer | |

Quick tip/guide to readers of the answer, like me.

You must create the userChrome.css inside your profile folder.

Operating system                    Profile folder location(s)
Windows NT (NT4.x/2000/XP/Vista/7)  "%APPDATA%\Mozilla\Profiles\XXXXXX.Default\"
Unix/Linux                          ~/.mozilla/
Mac OS X                            ~/Library/Mozilla/ -- ~/Library/Application Support/
  • Under Windows press Windows Key + R → Type in %APPDATA% → Click OK
  • Create a folder "chrome" inside your profile folder;
  • Create the nonexistent userChrome.css with the CSS string suggested;
  • Restart your browser.
| improve this answer | |
  • Does not work on my Firefox 37 on Windows 7 x64 & Windows 8.1 – Benj Jun 22 '15 at 10:04

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.