Antwort an „Rolf B“ verfassen

problematische Seite

Update: es passiert nur im zweiten .has-multiple-details. Wenn ich dessen Klasse auf "has-multiple-details2" umbenenne, die Regel mit :has(details[open]) doppele und darin die Klasse anpasse, dann funktioniert es.

FF kriegt es nicht hin, diese :has Regel auf beide Listen anzuwenden. Sehr merkwürdig.

Deine details sollten übrigens ein name Attribut bekommen, und das JS sollte prüfen, ob das details-Element das name Property kennt. Wenn nicht, kann es als Polyfill für den fehlenden name-Support von FF den toggle-Handler aktivieren. Und dann kannst Du den toggle-Handler auf dem .has-multiple-details Element registrieren und das toggle-Event zu Dir bubbeln lassen. In event.target steht dann das details-Element und in event.currentTarget das Container-Element, das Du derzeit mit .parentNode.parentNode herbeiholst (wobei .closest(".has-multiple-details") sicherlich robuster wäre)

Wenn der FF tatsächlich so strunzdumm ist, das CSS nicht richtig zu interpretieren, könntest Du in diesem Toggle-Handler auch eine Klasse setzen, die bei offenen Details eine Klasse setzt, die das ::after erzeugt. Ich probier's mal aus.

Rolf

--
sumpsi - posui - obstruxi
freiwillig, öffentlich sichtbar
freiwillig, öffentlich sichtbar
freiwillig, öffentlich sichtbar

Ihre Identität in einem Cookie zu speichern erlaubt es Ihnen, Ihre Beiträge zu editieren. Außerdem müssen Sie dann bei neuen Beiträgen nicht mehr die Felder Name, E-Mail und Homepage ausfüllen.

abbrechen