:required ein Symbol mit csshervorheben

[Gunnar Bittersmann]

@@Charlie

<div class="form">
<label>Nr<span>*</span></label>
<input type="text" name="name" required>
</div>

ich würde gerne das span nur anzeigen wenn ein required im Input vorhaden ist

Du kannst mit CSS nicht rückwärts selektieren; d.h. du kommst an das span nicht ran, wenn es vor dem imput steht.

Du kannst das span aber nach dem input im Markup haben und mit Flexbox die visuelle Reihenfolge vertauschen. Sieht dann so aus.

Ich lasse dabei das span immer anzeigen, aber nur bei Pflichtfeldern mit einem * füllen.

Dein Eingabefeld hat übrigens keine Beschriftung. label und input müssen über for-/id-Attribute gekoppelt sein oder das input muss sich innerhalb des label-Elements befinden.

LLAP 🖖