Servus! > Hallo Matthias, > > > Eben grad ausprobiert: > > Ich auch. In Chrome wirkungslos. Gerade im Fuchs nachgetestet: Aha, funktioniert! 😕 Ohne JavaScript: ~~~ CSS details p { overflow: hidden;} details[open] p { animation: sliding 1s forwards; border: thin solid; } @keyframes sliding { 0% { height: 0; } 100% { height: 200px; } } ~~~ Leider geht's nicht mit min-content; da muss ich noch schauen, wie man das hinbasteln kann. Auch `details p {animation: sliding 1s reverse; ..}`geht nicht. **[EDIT]** grad im Netz gefunden: Der Inhalt von details p verschwindet sofort, aber die Höhe des details-Elements kann einen weichen Übergang kriegen: ~~~ CSS details { height: 2em; transition: all 0.6s; } details[open] { transition: all 0.6s; height: 300px; } ~~~ Geht aber wohl nur mit festen Werten? 😟 **[[/EDIT]]** Herzliche Grüße Matthias Scharwies -- Einfach mal was von der [ToDo-Liste](https://wiki.selfhtml.org/wiki/Kategorie:ToDo) auf die Was-Solls-Liste setzen.“

Servus! > Hallo Matthias, > > > Eben grad ausprobiert: > > Ich auch. In Chrome wirkungslos. Gerade im Fuchs nachgetestet: Aha, funktioniert! 😕 Ohne JavaScript: ~~~ CSS details p { overflow: hidden;} details[open] p { animation: sliding 1s forwards; border: thin solid; } @keyframes sliding { 0% { height: 0; } 100% { height: 200px; } } ~~~ Leider geht's nicht mit min-content; da muss ich noch schauen, wie man das hinbasteln kann. Auch `details p {animation: sliding 1s reverse; ..}`geht nicht. Herzliche Grüße Matthias Scharwies -- Einfach mal was von der [ToDo-Liste](https://wiki.selfhtml.org/wiki/Kategorie:ToDo) auf die Was-Solls-Liste setzen.“