Label und Input Text schön ausrichten?

[hawkmaster]

Hallo zusammen,
Auf einer Seite sind mehrere input type= text untereinander.

  
<div class="styledirectories">  
<div>  
<label for="txt_TestDir">TestDir</label>  
<input name="txt_TestDir" type="text" id="txt_TestDir" value="C:\Test" />  
</div>  
</div>  
<div style="clear:left"></div>  
<div class="styledirectories">  
<div>  
<label for="txt_DocDir">DocDir</label>  
<input name="txt_DocDir" type="text" id="txt_DocDir" value="C:\Doc" />  
</div>  
</div>  
<div style="clear:left"></div>  

Die Label sind immer links vom Input. Was nun unschön aussieht ist die horizontale Ausrichtung der Inputs. Je nach Beschriftung und Länge des Labels fängt das Input dahinter mal früher mal weiter hinten an. Also eine Art Flattertext.
Selbst mit einem:
.styledirectories label{
padding-right:10em;
}

bringt es ja nichts.
Hat jemand eine Idee wie man die Inputs immer schön bündig in einer Reihe bringen kann?

vielen Dank und viele Grüße
hawk

[Reynhard B.]

Hallo

<label for="txt_TestDir">TestDir</label>
<input name="txt_TestDir" type="text" id="txt_TestDir" value="C:\Test" />
Hat jemand eine Idee wie man die Inputs immer schön bündig in einer Reihe bringen kann?

label zum Blockelement machen, eine Breite angeben und floaten lassen.

Reynhard B.

[hawkmaster]

Hallo Reynhard,

label zum Blockelement machen, eine Breite angeben und floaten lassen.

vielen Dank für den guten Tipp.
Ich hatte mir mit einem zusätzlichen DIV vor den Label beholfen aber deine Lösung ist natürlich noch eleganter.

vielen Dank und viele Grüße
hawk

[Reynhard B.]

Hallo

Ich hatte mir mit einem zusätzlichen DIV vor den Label beholfen aber deine Lösung ist natürlich noch eleganter.

Nein, nicht soviele divs!
Form und fieldset bieten genug Ansatz für CSS und sind noch dazu semantisch korrekt...

Reynhard B.