Where did you install Firefox from? Help Mozilla uncover 3rd party websites that offer problematic Firefox installation by taking part in our campaign. There will be swag, and you'll be featured in our blog if you manage to report at least 10 valid reports!

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

The Top Part of My FireFox Screen is All Foggy White (Aero)

  • 2 svar
  • 5 har dette problemet
  • 16 views
  • Siste svar av BESBESBES

more options

When using the Aero theme, the top of my screen (where the tabs are located) have a weird foggy white color. The only parts unaffected by this problem, are the top left and a little of the top right. I don't have High Contrast enabled. I'll attach a picture.

https://imageshack.com/i/5nzwdoj

When using the Aero theme, the top of my screen (where the tabs are located) have a weird foggy white color. The only parts unaffected by this problem, are the top left and a little of the top right. I don't have High Contrast enabled. I'll attach a picture. https://imageshack.com/i/5nzwdoj

Valgt løsning

Note that you're using Firefox 29. It's currently a beta version that will become the stable release at the end of the month.


  1. Install Stylish and restart Firefox when prompted.
  2. Click the ≡ Menu Button and choose Add-ons.
  3. In the Add-ons Manager, click the User Styles category on the left.
  4. Click the Write New Style button at the top. Paste the following in the text box, give the style a name, then click the Save button.
    • You can adjust the opacity value from 0 to 1.
    • This is the Australis Tab Defogger style. I just changed ::before to ::after because it doesn't work otherwise.

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

#TabsToolbar:not(:-moz-lwtheme)::after {
  opacity: 0.1 !important;
}

tab[selected="true"] {
  color: black !important;
  text-shadow: none !important;
}

tab {
  color: white !important;
  text-shadow:0 0 1px #333, 0 0 1px #333, 0 0 1px #333, 0 0 1px #333, 0 0 1px #333, 0 0 1px #333, 0 0 3px #000 !important;
}

#main-window .tabs-newtab-button,
#main-window #TabsToolbar #new-tab-button > .toolbarbutton-icon {
  list-style-image: url("chrome://browser/skin/tabbrowser/newtab-inverted.png") !important;
}

#main-window #alltabs-button[type="menu"],
#main-window .toolbarbutton-1 .dropmarker-icon {
  list-style-image: url("chrome://browser/skin/toolbarbutton-dropdown-arrow-inverted.png") !important;
}

#main-window #tabview-button {
  list-style-image: url("chrome://browser/skin/tabview/tabview-inverted.png") !important;
}

Les dette svaret i sammenhengen 👍 1

All Replies (2)

more options

Valgt løsning

Note that you're using Firefox 29. It's currently a beta version that will become the stable release at the end of the month.


  1. Install Stylish and restart Firefox when prompted.
  2. Click the ≡ Menu Button and choose Add-ons.
  3. In the Add-ons Manager, click the User Styles category on the left.
  4. Click the Write New Style button at the top. Paste the following in the text box, give the style a name, then click the Save button.
    • You can adjust the opacity value from 0 to 1.
    • This is the Australis Tab Defogger style. I just changed ::before to ::after because it doesn't work otherwise.

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

#TabsToolbar:not(:-moz-lwtheme)::after {
  opacity: 0.1 !important;
}

tab[selected="true"] {
  color: black !important;
  text-shadow: none !important;
}

tab {
  color: white !important;
  text-shadow:0 0 1px #333, 0 0 1px #333, 0 0 1px #333, 0 0 1px #333, 0 0 1px #333, 0 0 1px #333, 0 0 3px #000 !important;
}

#main-window .tabs-newtab-button,
#main-window #TabsToolbar #new-tab-button > .toolbarbutton-icon {
  list-style-image: url("chrome://browser/skin/tabbrowser/newtab-inverted.png") !important;
}

#main-window #alltabs-button[type="menu"],
#main-window .toolbarbutton-1 .dropmarker-icon {
  list-style-image: url("chrome://browser/skin/toolbarbutton-dropdown-arrow-inverted.png") !important;
}

#main-window #tabview-button {
  list-style-image: url("chrome://browser/skin/tabview/tabview-inverted.png") !important;
}

more options

It worked! Thank you so much! You won't believe how many hours I've been on the Internet just trying to find a solution.