Nach neustem Update Hintergrund von Drop-Down Menüs auf Websites schwarz

Hallo Zusammen,

da ich seit dem neusten Update auf 95.0.2 Probleme mit der Darstellung von Websites habe, habe ich mich hier angemeldet um meinen ersten Betrag zu schreiben und hoffe ich mache alles richtig und dass mir jemand helfen kann.

Seit dem ich FF auf o.g. Version aktualisiert habe, werden mir Drop-Down Menüs mit schwarzem bzw. sehr dunklem grauen Hintergrund angezeigt. Bspw. bei der Anmeldemaske auf Bandcamp (siehe angehängten Screenshot). Dort ist die Schriftfarbe weiß, da lässt sich das noch händeln. Aber bei meinem Email Account bspw. ist auch die Schrift schwarz! Da kann man fast gar nichts mehr lesen.

Was auch neu ist, seit dem Update, dass mir die Google Seite schwarz angezeigt wird...

Zur Info, ich habe in Windows und im FF ein dark theme instaliert. Aber die oben beschriebenen Darstellungsprobleme hatte ich vor dem Update nicht. Drop down waren immer weiß, egal welche Seite. Auch Google war immer weiß. Das kann ich zwar auf der Google website ändern, aber bei jedem Cache leeren und Cookies Löschen ist Google wieder schwarz.

Wie kann ich das ändern, bzw. was muss ich machen, damit das wieder so ist wie vorher?

Vielen Dank im Voraus für Hilfe.

Betriebssystem: Win 7 Pro SP2

Firefox: 95.0.2

Hallo und vielen Dank für die schnelle Antwort.

Ich habe mir das durchgelesen, was Du verlinkt hast, aber da verstehe ich nur Bahnhof. Ich hab mir auch schonmal was über about:config geändert nach einem Update, weil da was nicht mehr so war wie vor dem update. Auch in irgendeiner CSS datei, habe ich mal fertigen code eingefügt um die Tableiste zu verschieben. Aber mit diesen CSS Sachen kommen ich im allgemeinen nicht so gut zurecht.

Helfen würde mir, wenn Du mir schreiben könntest, was ich wo wie eintragen soll. Lieben Dank im Voraus.

Zitat von Sören Hentzschel

layout.css.prefers-color-scheme.content-override in about:config auf 2

Das hat mir sehr gut geholfen bzgl. des Hintergrundes bspw. bei Google. Vielen Dank

Zitat von 2002Andreas

Der Code aus dem Beitrag gehört in die userContent.css Datei.

Vielen Dank für die tolle Hilfe. Ich habe bei mir auf dem Rechner folgendes gefunden:

C:\Users\Username\AppData\Roaming\Mozilla\Firefox\Profiles\zjpbcd51.default\chrome\userChrome.css

Eine userContent.css geibt es (noch) nicht. Aber ich habe etwas gefunden, was ich in die userChrome.css eiingetragen habe und mir schonmal weitergeholfen hat:

.popup-internal-box,
menupopup,
popup {
    -moz-appearance: none !important;
    border: none !important;
    } 
   
menupopup > menu ,
menupopup > menuitem,
popup > menu ,
popup > menuitem  {
   -moz-appearance: none !important;
   color: red !important;
   background-color: yellow !important;
    }
    
.popup-internal-box * {
    background-color: yellow !important; 
    }

Gefunden habe ich das hier:

Thema

Dropdown Menü anpassen

Ich suche ein css Programm, mit dem ich
die Schriftfarbe, Schriftgröße und den Hintergrund in den dropdown
Menüs im FF 71.0 ändern kann.

Vielen Dank im voraus.

sysopa

23. Dezember 2019 um 22:05

Die Schriftfarbe habe ich auf "white" gesetzt und das mit dem Hintergrund weggelassen. Das hat mir super bei meinem Email Account geholfen. Dort ist die Schrift im Dropdown Menü nun weiß auf dunkelgrauem Hintergrund (siehe Screenshot).

CSS dafür sieht so aus:

.popup-internal-box,
menupopup,
popup {
    -moz-appearance: none !important;
    border: none !important;
    } 
   
menupopup > menu ,
menupopup > menuitem,
popup > menu ,
popup > menuitem  {
   -moz-appearance: none !important;
   color: white !important;
    }

Allerdings habe ich nun das Problem, das auch im Kontextmenü im FF die Schrift weiß ist und das auf hellem Hintergrund, so dass die Schrift nicht mehr lesbar ist (siehe zweiten Screenshot).

Was toll wäre, wenn es etwas gäbe, dass ich als CSS eintragen kann, damit NUR das Dropdownmenü mit weißer Schrift ist und nicht alles, wie bspw. das Kontextmenü. Gibt es da was?

Das mit dem CSS aus dem anderen Thread, habe ich zugegebenermaßen noch nicht ausprobiert, werde das aber jetzt machen und dann Rückmeldung geben, ob das funktioniert hat.

Zitat von 2002Andreas

Und teste es dann mal auf der Webseite.

Lieben Dank. Leider hat das keinerlei Veränderung gezeigt. Ich habe in meiner CSS alle Veränderungen rückgängig gemacht und Deinen Code eingefügt = keine Veränderung. Kontextmenü ist nun wieder normal. Aber durch das Rückgängigmachen der Schriftfarbenveränderung (white) ist in meinem Email Account nun das Dropdown Menü wie direkt nach dem FF Update: dunkelgrauer Hintergrund und schwarze Schrift.

Bezieht sich das hier:

#PopupAutoComplete

wirklich auf das Dropdown Menü auf websites? In Deinem Screenshot sieht das so aus, aber "AutoComplete" suggeriert mir eher, das es die Autoausfüll-Funktion bei Passwörtern etc. ist.

Zitat von Mr.Websta

Das mit dem CSS aus dem anderen Thread, habe ich zugegebenermaßen noch nicht ausprobiert, werde das aber jetzt machen und dann Rückmeldung geben, ob das funktioniert hat.

Das hat übrigens auch keinerlei Veränderung gebracht. Also den CSS code aus der Verlinkung in Deiner ersten Antwort, meine ich.

Das PopupAutoComplete habe ich nochmal getestet, nachdem ich in den FF Einstellungen > Allgeimein > Farbe die Systemfarben deaktiviert habe. Danach war das Dropdownmenü so wie ich es eingestellt habe: schwarzer Hintergrund und rote Schrift:

Das hat jedoch keinen Effekt gehabt auf das Dropdownmenü in meinem Email Account. Nun könnte die Vermutuung nahe liegen, dass es etwas mit meinem Email Account zu tun hat. ABER in meinem Account kann man keine Farben etc. einstellen und VOR dem FF Update bestand das Problem ja nicht. Hinzukommt, dass ich es ja geschaft habe, mit CSS da die Schrift auf weiß zu ändern... Hmmm... bin da voll ratlos.

Ich hab alles was ich Testweise als CSS eingefügt habe wieder rückgängig gemacht und hiermit die Schriftfarbe auf grau gesetzt und bei dem Hovereffekt auf weiß:

.popup-internal-box,
menupopup,
popup {
    -moz-appearance: none !important;
    border: none !important;
    } 
  
menupopup > menu ,
menupopup > menuitem,
popup > menu ,
popup > menuitem  {
   -moz-appearance: none !important;
   color: grey !important;
    }
    
menupopup > menu:hover ,
menupopup > menuitem:hover ,
popup > menu:hover ,
popup > menuitem:hover {
   -moz-appearance: none !important;
   color: white !important;
    }

So kann ich sowohl im Kontextmenü, als auch in dem Dropdownmenü die Schrift erkennen. Das ist nicht das was ich wollte und es sieht auch nicht besonders schön aus, aber so komme ich wenigstens halbwegs damit klar. Wenn Du noch andere Vorschläge hast, probiere ich das gerne aus. Vielen Dank auf jeden Fall für die tolle Hilfe bisher.

Ach... das o.g. musste ich wieder Rückgängig machen, da es auch die Schrift in meinen Lesezeichen verändert hat. Das nervt einfach nur. Warum kann Mozilla nicht einfach ein Sicherheitsupdate oder so machen und lässt das Design in ruhe. Oder bietet ein Update an ohne Designänderungen.

Ich habe bemerkt, dass auch auf vielen anderen Websites bspw. PayPal, DHL auch die Dropdownmenüs nach dem letzten FF Update auch total anders aussehen und teilweise nicht mehr zu lesen sind (PayPal z.B). Das kann es doch nicht sein.

Wie kann ich das Update Rückgängig machen? Ich will dieses 95 Update nicht mehr haben, das ist einfach nur ätzend.

Sorry, aber ich bin total gefrustet. Vorher war alles so wie es sein sollte und gut war.

Zitat von Boersenfeger

Du scheinst zu meinen, das wir diese UpDates bereitstellen.

Nein tue ich nicht. Das ist mir auch vorher klar gewesen. Sorry, wenn das missversändlich rübergekommen ist. Ich suche nur jetzt schon recht lange nach einer Lösung, damit ich wieder die Drop-Down-Menüs lesen kann und habe alle Tipps von hier und auch von Tante Google ausprobiert, aber es hat bisher nichts gebracht. Daher war ich - wie oben geschrieben und auch da bereits mit einem "Sorry" versehen - echt gefrustet. Ich habe hier niemanden beleidigt oder blöde angemacht. Im Gegenteil, mich für die Hilfen bedankt. Ja, aber meinem Unmut über das neue Update habe ich auch Luft gemacht. Mich deswegen als bockiges Kind zu bezeichnen und zu sagen, dass mein Verhalten lächerlich ist, finde ich unangebracht, gerade gegenüber einem neuen User im Forum. Da hätte ein, komm mal wieder runter oder beruhig Dich mal auch seinen Zweck erfüllt. Und mit Verlaub, da ich ja auf die Foren-Regeln hingewiesen wurde:

2.1

"Ebenso nicht erlaubt sind direkte oder angedeutete Beleidigungen, Verleumdungen, Fäkalsprache sowie persönliche Angriffe anderer Art."

2.4

"Es gilt grundsätzlich Meinungsfreiheit. Meinungen anderer Nutzer sind zu tolerieren, auch wenn der jeweiligen Meinung nicht zugestimmt wird. Natürlich sind Diskussionen zu den jeweiligen Themen gestattet, Beleidigungen oder Ähnliches sind allerdings nicht erwünscht und werden entsprechend geahndet."

Zitat von 2002Andreas

Dazu gibt es in diesem Forum keinerlei Hilfe, steht auch so in unseren Forenregeln.

Das stimmt. War nicht angebracht. Sorry. Hatte ich wohl ausgeblendet, als ich das geschrieben hatte. Da war der Frust stärker, als mein Erinnerungsvermögen. Die Regeln hatte ich mir natürlich durchgelesen, aber in der kurzen Zeit, seit ich hier bin, noch nicht verinnerlicht. Das sehe man mir bitte nach, all Neuling im Forum.

Zitat von 2002Andreas

Mozilla kann machen was sie wollen, es ist ihr Browser.

Wir können ihn dann nutzen, oder es lassen, es gibt noch andere Browser.

Ist auch klar. Aber seine Meinung darf man doch noch sagen und auch mal meckern. Oder ist das hier verboten? FF ist und bleibt für mich der beste Browser. Nenn es Jammern auf hohem Niveau, wenn Du magst, aber ich habe seit dem letzten Update erhebliche Probleme diverse DropDownMenüs zu entzifferen, da auf einmal der Hintergrund dunkelgrau ist, statt wie bisher weiß.

Zitat von 2002Andreas

Zu deinem Problem.

Bei mir haben diese Felder/Popups auch einen schwarzen Hg, aber weiße Schrift.

Das bei Nutzung eines dunklen Themes vom Fx, und dem about:cconfig Wert auf 2 geändert.

Der Wert steht bei mir auch auf 2.

Zitat von 2002Andreas

Daher denke ich, es liegt an einem anderen Grund bei dir, dass du eine schwarze Schrift hast.

Ich denke auch, dass es nicht an dem about:config Wert liegt, falls Du das damit meinst. Aber ich denke doch, dass es an dem letzten Update liegt.

Was ich bisher noch ausprobiert habe um das Problem zu lösen - und das möchte ich an dieser Stelle erneut hervorheben - welches erst nach dem letzten Update auftrat. Und vorab auch zur Info: die zwei einzigen Sachen die ich jeh in meinem CSS geändert hatte war 1. die Tableiste nach unten, unter die Adressleiste und unter die Lezeichen-Symbolleiste zu setzen und 2. die Abstände in den Lesezeichen und im Kontextmenü schmaler zu machen. Aber keinerlei farblichen Anpassungen o.ä.

- Windows Design von dunkel auf hell geändert = keine Veränderung

- Farben-Einstellung im FF geändert = keine Veränderung

- about:config 0,1,2 und 3 ausprobiert = keine Veränderung

- FF Firefox im Fehlerbehebungsmodus gestartet = keine Veränderung

- FF Theme von dunkel auf hell = totale Veränderung, DropDown wieder lesbar, dafür aber kein dunkles Theme mehr

Ich habe mir jetzt mal Firefox-Color installiert und werde damit ein wenig rumspielen und versuchen mir ein Theme zu basteln, welches die DropDownmenüs nicht verändert, aber dafür ein dunkles Theme erstellt. Bei Erfolg oder Misserfolg, gebe ich Rückmeldung dazu. Bis dahin erneut vielen Dank für Eure Ratschläge und Tipps.

Zitat von Boersenfeger

Vielleicht postest du auch mal diese Codes. Ggf. liegt doch dort der Hase im Pfeffer.

/* Tableiste nach unten */

#titlebar {
  -moz-box-ordinal-group: 100 !important;
  }

#main-window[tabsintitlebar][sizemode="maximized"] * #titlebar {
  margin-top: -8px !important;
  }

#main-window[tabsintitlebar]:not([sizemode="fullscreen"]) #nav-bar {
  margin-top: 40px !important;
 }

#main-window[tabsintitlebar][sizemode="maximized"]:not([sizemode="fullscreen"]) #nav-
bar {
  margin-top: 6px !important;
 }

#main-window[tabsintitlebar] #navigator-toolbox,
#main-window[tabsintitlebar] #nav-bar {
  -moz-window-dragging: drag !important;
 }

#toolbar-menubar {
  top: 10px !important;
  position: fixed !important;
  width: 100vw !important;
  -moz-window-dragging: drag !important;
 }

#main-window[tabsintitlebar]:not([inDOMFullscreen="true"]) .titlebar-buttonbox-container {
  position: fixed !important;
  right: 0 !important;
  visibility: visible !important;
  display: block !important;
 }

#main-window[tabsintitlebar][sizemode="maximized"] #toolbar-menubar {
  top: 0px !important;
 }

#main-window[tabsintitlebar]:not([inDOMFullscreen="true"]) .titlebar-buttonbox-container,
#main-window[tabsintitlebar][sizemode="maximized"]:not([inDOMFullscreen="true"]) 
.titlebar-buttonbox-container {
  top: 4px !important;
 }

@media (-moz-os-version:windows-win10), (-moz-os-version:windows-win8), (-moz-os-
version:windows-win7) {
    
    #main-window:not([tabsintitlebar]):not([sizemode="fullscreen"]) #nav-bar {
      margin-top: 8px !important;
    }
    
    #main-window[tabsintitlebar][sizemode="maximized"]:not
([sizemode="fullscreen"]) #nav-bar {
      margin-top: 4px !important;
    }
    #main-window[tabsintitlebar][sizemode="maximized"] #toolbar-menubar {
      top: 8px !important;
    }
    #main-window[tabsintitlebar]:not([inDOMFullscreen="true"]) .titlebar-buttonbox-
container {
      top: 0px !important;
    }
    #main-window[tabsintitlebar][sizemode="maximized"]:not
([inDOMFullscreen="true"]) .titlebar-buttonbox-container {
      top: 8px !important;
    }
 }

#main-window:not([tabsintitlebar]) #nav-bar,
#main-window:not([tabsintitlebar]) #navigator-toolbox {
  border-top: 0 !important;
  box-shadow: unset !important;
 }

#main-window[tabsintitlebar][sizemode="fullscreen"] * #TabsToolbar {
 -moz-padding-start: 0px !important;
 }

#main-window[tabsintitlebar][sizemode="fullscreen"]:not([inDOMFullscreen="true"]) 
.titlebar-buttonbox-container,
#main-window[tabsintitlebar][sizemode="fullscreen"] #toolbar-menubar[autohide="true"] ~ 
#TabsToolbar .titlebar-buttonbox-container,
#main-window[tabsintitlebar][sizemode="fullscreen"] #navigator-toolbox #PanelUI-button,
#main-window #TabsToolbar #window-controls {
  display: none !important;
 }

#TabsToolbar .private-browsing-indicator,
#TabsToolbar #window-controls,
#TabsToolbar *[type="caption-buttons"],
#TabsToolbar *[type="pre-tabs"],
#TabsToolbar *[type="post-tabs"] {
  display: none !important;
 }

@media (-moz-os-version: windows-win7) {
  @media all and (-moz-windows-compositor) {
    #main-window[tabsintitlebar]:not([inDOMFullscreen="true"]) * .titlebar-
buttonbox-container {
      display: none !important;
    }
  }
  @media not all and (-moz-windows-compositor) {
    #main-window[tabsintitlebar]:not([inDOMFullscreen="true"]) .titlebar-buttonbox-
container {
      top: -8px !important;
    }
    #main-window[tabsintitlebar][sizemode="maximized"]:not
([inDOMFullscreen="true"]) .titlebar-buttonbox-container {
      top: 0px !important;
    }
  }
 }

@media (-moz-os-version: windows-win10) {
  #main-window:not([tabsintitlebar]) menubar > menu:not(:-moz-lwtheme):hover:not
([disabled="true"]),
  #main-window:not([tabsintitlebar]) menubar > menu:not(:-moz-lwtheme)[_moz-
menuactive="true"]:not([disabled="true"]) {
    background-color: Highlight !important;
    color: HighlightText !important;
  }
 }

#navigator-toolbox[movingtab] > #titlebar > #TabsToolbar {
  padding-bottom: unset !important;
 }

#navigator-toolbox[movingtab] #tabbrowser-tabs {
  padding-bottom: unset !important;
  margin-bottom: unset !important;
 }

#navigator-toolbox[movingtab] > #nav-bar {
  margin-top: unset !important;
 }


/*Abstände der Einträge im Kontextmenü und Lesezeichen wieder schmaler*/

menupopup > menuitem,
menupopup > menu {
  padding-block: 0 !important;
}