Hilfebedürftiger: Input-Feld Size/Width

Beitrag lesen

Hallo liebe Helfer,

ich habe mehrere Input-Felder.

Da ich genau weiss wieviele Zeichen ein Input-Feld aufnehmen soll, habe ich die MaxLength und Size auf diese Anzahl von Zeichen gesetzt.

Außerdem wurden folgende Attribute per CSS gesetzt:

  
.input{  
  font-family: Tahoma;  
  font-size: 15px;  
  font-weight: bold  
}  

Nun unterscheidet sich leider die Breite der Input-Felder nicht nur aufgrund der in Size angegebenen Längen, sondern auch bei unterschiedlichen Browsern (bzw Browserversionen).

Also zB bei einer Input Size=2 die Breite im 1. Browser: 30px, im 2. Browser 40px...

Eine Lösung dafür wäre, statt der Size-Angabe den Inputfelder die Breite per
style="width: .. px" vorzugeben.

<INPUT class="input" maxLength="2" size="2" name="xyz" style="width: 30px">

Leider funktioniert diese Variante nur, wenn nicht irgendwann das CSS geändert wird.
Denn mit font-size: 25px müssten ja auch die Weiten-Angabe korrigiert werden => jede Datei anfassen...

Zweite Möglichkeit wäre, für jede Size eine eigene Definition zu machen und die zugehörige Breite mitzugeben.

Also zB den Inputfeldern die class="inputfeld2stellig" oder class="inputfeld3stellig" zu geben.

Nachteil wäre, dass man dann x Definitionen hat, wie zB:

  
.inputfeld2stellig{  
  font-family: Tahoma;  
  font-size: 15px;  
  font-weight: bold;  
  width: 30px;  
}  
  
.inputfeld3stellig{  
  font-family: Tahoma;  
  font-size: 15px;  
  font-weight: bold;  
  width: 38px;  
}  

welche im Falle einer Änderung auf font-size: 25px genauso gepflegt werden müssen...

Vielleicht hat ja jemand eine Lösung, mit der anhand der Schriftart/Größe und Size-Angabe die Breite unabhängig vom Browser festgelegt werden kann!?
Und das ganze natürlich möglichst pflegeleicht ;-)

Nehme auch gerne Denkanstösse entgegen :-)