Auswahlfelder/Optionsfelder nicht sichtbar

reni

Hallo,

mit diesem CSS-Code wird mein Menü bei Hover sehr schön grün unterlegt.

Aber ... leider sind dann die Auswahlfelder bzw. Optionsfelder nicht sichtbar

2 Bilder fürs Verständnis:

Und hier der CSS-Code:

CSS

/* Hover Schrift-Farbe schwarz, wird beim hovern Grün unterlegt
popupset >*:not(menupopup) menupopup :is(menu,menuitem)[_moz-menuactive="true"],
menupopup :is(menu,menuitem)[_moz-menuactive="true"],
menupopup > menu:hover:not([disabled="true"]),
menupopup > menuitem:hover:not([disabled="true"]),
popup > menu:hover:not([disabled="true"]),
descriptionpopup > menuitem:hover:not([disabled="true"]) {
appearance: none !important;
background: green !important;
color: white !important;
} */




/*Höhenverschiebung Menüzeilen durch Hovereffekt verhindern
menupopup > menu ,
menupopup > menuitem,popup > menu ,
popup > menuitem {
appearance: none!important;
min-height: 27px !important;
max-height: 27px !important;
} */

Alles anzeigen

Wenn ich den Code deaktiviere, sind die Felder wieder da.

Wer weiß dazu einen Tipp?

2002Andreas

Zitat von reni

die Auswahlfelder bzw. Optionsfelder nicht sichtbar

Sieht hier so aus damit:

milupo

Die Optionsfelder gibt es nicht, sondern es sieht so aus, wie 2002Andreas zeigt. Was bedeutet eigentlich Ip152.2.1? Möglicherweise hast du ein Theme von Firefox unter OpenSuse.

reni

Zitat von 2002Andreas

Zitat von reni

die Auswahlfelder bzw. Optionsfelder nicht sichtbar

Sieht hier so aus damit:

Bei dir funzt immer alles ...

Zitat von milupo

Die Optionsfelder gibt es nicht, sondern es sieht so aus, wie 2002Andreas zeigt. Was bedeutet eigentlich Ip152.2.1? Möglicherweise hast du ein Theme von Firefox unter OpenSuse.

Das lp152 bezieht sich auf die openSUSE-Version (Leap 15.2), der Rest gehört zur Version des Programms.

Als Thema hab ich hier gerade: Brushed Metal - wenn ich das Default-Thema aktiviere, sind die "Knöpfe" auch nicht zu sehen.

2002Andreas

Zitat von reni

Bei dir funzt immer alles

Und wenn du mal nur diesen Teil aus dem Code entfernst?

CSS

menupopup > menu ,
menupopup > menuitem,popup > menu ,
popup > menuitem {
appearance: none!important;
min-height: 27px !important;
max-height: 27px !important;
}

Dann würde es wahrscheinlich an der height Angabe liegen

Sören Hentzschel

Wenn man den zweiten Code-Block von reni anwendet, dann fehlt das Häkchen, was aber ja auch auf Grund von appearance: none logisch ist. Denn damit sagt man ja explizit, dass man nicht die native checkmenuitem - appearance haben möchte. Ergo muss man das dann selbst implementieren.

2002Andreas

Zitat von Sören Hentzschel

Wenn man beide Code-Blöcke von reni anwendet

Dann sieht das hier so aus:

Sören Hentzschel

Möglicherweise nutzt Firefox für Windows an dieser Stelle bereits von Haus aus nicht die native Darstellung des Betriebssystems, das kann ich gerade nicht testen. Dann bewirkt diese Zeile natürlich überhaupt nichts. Auf macOS trifft das aber in jedem Fall zu und offensichtlich auch auf Linux.

milupo

Ich habe das Theme Brushed Metal in einem frischen Profil installiert. Da gibt es keine Optionsschaltflächen, allerdings auch hier unter Windows.

2002Andreas

Zitat von milupo

das Theme Brushed Metal

Meinst du das?

milupo

Nein, das:

Nur Brushed Metal.

Für appearance gibt es z. B. auch die Werte radio, radio-container und radio-small, die sich auf die Optionsschaltflächen beziehen.

2002Andreas

Zitat von milupo

Nein, das:

milupo

Ja.

reni

Danke für eure vielen Gedanken dazu.

Ich hab jetzt folgendes getestet - im 2. Block das "appearance: none!important" auskommentiert und damit sind die Felder wieder sichtbar (Bild)

Aber ... jetzt verschieben sich die Einträge ganz leicht beim Hover

siehe Bild (ich hoffe, man erkennt, was ich meine):

Und damit wird das alles ziemlich unruhig. Das ganze verhält sich übrigens auch mit dem Default-Thema so.

Hier noch ein Bild zum benutzen Thema:

milupo

Setze mal die beiden appearance-Eigenschaften auf auto.

reni

Leider keine Änderung.

EDIT: Sorry, stimmt nicht. Wenn ich beide appearance auf "auto" stelle, dann hab ich mein grün nicht - sieht also unverändert zum Original aus.