Underline Animation

[Gunnar Bittersmann]

@@KillerKalle

https://codepen.io/KillerKalle/pen/XWKEQjz

Ich habe nur das problem, dass ich es nicht hinbekomme, dass die animation nur bei der überschrift startet, über die ich hover.

Was für eine Überschrift? Ich sehe da nur divs und spans.

.underline_on_hover:hover .hover:before, .underline_on_hover:hover .hover:after`

Damit selektierst du die Pseudoelemente aller Elemente der Klasse hover (ziemlich unsinnige Benennung, BTW), die sich innerhalb eines gehoverten Elements der Klasse underline_on_hover befinden – also beider.

Du willst stattdessen auf :hover jedes einzelnen Elements der Klasse hover reagieren:

.hover:hover::before, .hover:hover::after

Und ja: Pseudoklassen mit einem Doppelpunkt, Pseudoelemente mit zweien.

😷 LLAP