nicht angemeldet
Hi,
ich möchte folgende HTML-Struktur sauber mit CSS formatieren.
Es handelt sich um ein Teil aus einem Formular, welches durch HTML nur logisch beschrieben wird. Alle Elemente des Formulars entsprechen dem Schema:
<div>
<label>Name</label>
<input type="text" alt="..." />
</div>
klar soweit?
früher habe ich meine Formulare mit Tabellen gemacht, aber mit CSS ist man ja doch flexibler... dachte ich.
Ich möchte nun beide Elemente (label und input) horizontal zueinander ausrichten. Das Label soll (vertikal) mittig zum Input stehen und umgekehrt (falls z.B. das Label höher ist als die Textbox).
Früher:
<tr>
<td valign="center">Name</td>
<td valign="center"><input type="text" .... /></td>
</tr>
Hatte nun folgende Probleme mir CSS:
1. wenn ich dem label eine width gebe, tut sich GAR nichts! Wieso?
2. gebe ich dem label: display:block, nimmt er zwar die width richtig, aber beide elemente stehen natürlich untereinander.
3. gebe ich dem label ein float:left, stimmts auch soweit.
Allerdings habe ich es nie geschafft, die Elemente vertikal zu einander auszurichten! vertical-align: middle zeigt null Wirkung.
Es klappt nur, wenn ich float oder display weglasse, aber dann kommt wieder der Fehler, dass die width nicht interpretiert wird.
Kann man inline-Elementen keine width geben?
Und wie richte ich nun die beiden Elemente schön sauber zu einander vertikal aus?
Danke+ Gruß
Christian
MudGuard