[HTML/CSS]Float Label bei Formfeldern

[froeschli]

In der Schule haben wir gerade einen Crashkurs in Sachen JavaScript. Im Rahmen einer praktischen Übung mussten wir einen Zinsrechner programmieren und als HTML Formular aufbauen. Die Labels die ich den einzelnen Formularfelder zugewiesen habe, verschwinden jedoch hinter den Formularfeldern, weil ich sie gefloatet habe (bei Anzeigen im FF / im IE korrekte Darstellung).

Damit ich den Rahmen dieses Forums nicht sprenge, habe ich den Quellcode hier abgelegt.

Ich habe bereits verschiedene Sachen im Internet gefunden, von wegen Floating Label Bug etc im Firefox, jedoch ist laut dem FF-eigenen Bugtracker dieser Fehler bereits seit geraumer Zeit behoben. Ich bin mit FF 2.0.0.12 unterwegs.

Besten Dank für jegliches Feedback.

Gruss froeschli

 

[Dragonlord]

Css

Definiere im CSS bei input und label folgendes:

position: absolute;

oder 

position: relative;

Musst halt schnell versuchen was stimmt.

lg Roger

 

[froeschli]

@Dragonlord:

Diese Eigenschaften funktionieren nur, wenn ich die Float Eigenschaft ausschalte. Dann werden die Labels jedoch oberhalb der Formfelder angezeigt anstatt, wie gewünscht, links davon.

Gruss froeschli

 

[froeschli]

Die offizielle Lösung seitens meines Dozenten lautet, dass im CSS das Attribut margin-left der Inputbox auf die Breite des Labels gesetzt werden muss.

Gruss froeschli

 

[Dragonlord]

Lösung

Bei Deiner Lösung im Internet hast Du das schon geändert?

lg Roger

 

[froeschli]

Ja. Soeben.

Gruss froeschli