This site will have limited functionality while we undergo maintenance to improve your experience. If an article doesn't solve your issue and you want to ask a question, we have our support community waiting to help you at @FirefoxSupport on Twitter and/r/firefox on Reddit.

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

Natao arisiva ity resaka mitohy ity. Mametraha fanontaniana azafady raha mila fanampiana.

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

  • 2 valiny
  • 5 manana an'ity olana ity
  • 29 views
  • Valiny farany nomen'i 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

Vahaolana nofidina

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;
}

Hamaky an'ity valiny ity @ sehatra 👍 1

All Replies (2)

more options

Vahaolana Nofidina

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.