hallo
ich habe folgendes problem:
wenn ich innerhalb eines DIV oder einer TD ein input-feld (z.b. text) mit style="width: 100%;" versehe, zeigen der firefox, IE6 und 7 das input-feld größer an als 100%, und zwar am rechten rand um genau 4px.
wenn ich das richtig sehe, werden die 4px des linken und rechten rands des input-felds der gesamtbreite zugerechnet, also 100% + 2px rand links + 2px rand rechts = 100% +4px (box-modell).
kennt jemand eine moeglichkeit, um diese 4px auszugleichen?
hier ist der auszug aus den quelltexten:
input.frmText {
width: 100%;
}
...
<div style="width: 300px;">
<input type="text" name="name" value="" class="frmText" />
</div>
...
ich habe folgende moeglichkeiten per CSS versucht:
input.frmText {
text-indent: -4px;
}
damit ist rand rechts nicht mehr abgeschnitten, dafuer aber links und dort kann ich ihn ebenso wenig ausgleichen.
alternativ ueber margin-right:
input.frmText {
margin-right: 4px;
}
dann drueckt das input-feld den div-container bzw. die TD weiter nach rechts aussen.
und - die hoffnung stirbt zuletzt ;-) - per CSS3:
input.frmText {
width: calc( 100% - 4px );
}
aber das ist noch zukunftsmusik.
jemand eine alternative idee?
fragt freundlich
timex