Label class "active"

[ThorstenR]

Hallo liebe Community,

weiß jemand, ob es beim Label der Formulare eine Änderung bei der Klasse "active" zwischen contao 3.5.9 und 3.5.15 gab?

In dem konkreten Fall hab ich ein Formular dass die Labels "über" die Inputs legt (also quasi als Platzhalter darstellt). Beim klicken des entsprechenden Inputs verschiebt sich das Label nach oben über das Input-Feld. Gelöst wurde das nur per CSS über die active-Klasse. Bei dem Projekt standen noch einige Änderungen an. Dabei wurde auch ein Update von contao Version 3.5.9 auf 3.5.15 gemacht. Ansonsten gab es keine Änderungen an den Formularen. Das CSS funktioniert in einem BackUp (3.5.9) noch einwandfrei, bei Version 3.5.15 wird dem Label keine active-Klasse mehr zugewiesen.

Gab es eine Änderung? Oder weiß jemand woran das liegen könnte?

Danke

EDIT: Mittlerweile in einer lokalen Testinstallation (3.5.15) ein Input-Feld (ohne CSS) getestet. Auch hier beim Label keine active-Klasse mehr.

[tab]

Bist du dir sicher, dass es da jemals eine active Klasse gab? Wann soll die denn zugewiesen werden? Könnte ja eigentlich nur per Javascript passieren . Ich habe gerade mal in einer 3.5.4 geschaut und konnte im Kontaktformular nirgends eine active-Klasse entdecken.

[lucina]

Eine .active-Klasse ist mir in dem Zusammenhang nicht bekannt. Das Element könnte vermutlich den :focus bekommen.

[ThorstenR]

Zumindest bis gerade war ich das. Zugewiesen wird die Klasse, sobald man in das zugehörige Input-Feld klickt.

In den Chrome Dev-Tools sieht das dann wie im Anhang aus.

[Spooky]

Dann musst du herausfinden welches JavaScript das bei dir macht oder gemacht hat. Denn von Haus aus passiert das nicht.

[ThorstenR]

Danke für eure Antworten.

Es war/ist tatsächlich ein JavaScript, das während der Entwicklungsphase verwendet wurde und diese Funktion ungewollt mitgebracht hatte. Contao kann also gar nichts dafür, da hab ich einfach falsche Schlüsse gezogen

Hinweis von @lucina
Ist es denn semantisch korrekt im Template das <label> nach dem <input> zu platzieren. Eine andere Möglichkeit sehe ich nicht, durch :focus beim input die line-height des Labels zu ändern.

[comanche]

@TorstenR

Wieso verwendest du das Label als Platzhalter - und nicht die Platzhalter-Option der Input Felder?

Ist es denn semantisch korrekt im Template das <label> nach dem <input> zu platzieren.

Ist eigentlich nicht nötig, die Reihenfolge zu ändern.

[Andreas]

Ich würde auch nach einer Lösung suchen, bei der du die Templates nicht verändern musst, weil es evtl. auch zu viele sind.

Semantisch korrekt ist es auch unter dem Input, oder auch irgendwo anders auf der Seite, solange sie über das FOR-Attribut mit der ID des INPUTS verbunden sind. Auch ein Wrappen des INPUTS mit LABEL ist möglich, dabei benötigt man das FOR nicht.

Am besten sieht es im Quelltext natürlich aus, wenn das LABEL direkt vor dem INPUT steht.

Wenn du keine Lösung mit LABEL vor dem INPUT per CSS findest, kannst du auch JS mit ins Spiel bringen. Im krassesten Fall kannst du die LABELs mit JS nach den INPUTS platzieren.