GodfatherX: Input-Felder werden bei langem Text im IE breiter

Beitrag lesen

Würgaround:

<table width="300" cellpadding="0" cellspacing="0" border="1" style="table-layout:fixed;">
<tr>
<td><input type="text" name="test" value="Langer Test-Text, der nicht komplett in das INPUT-Feld passen sollte, jedoch das Feld nicht weiter als die gesetzte Breite ausdehen soll." maxlength="255" style="width:100%;"></td>
</tr>
<tr>
<td>Das ist ein Test, der eine gewisse Breite hat und innerhalb der Tabelle umbrechen sollte.</td>
</tr>
</table>

Welche weiteren Auswirkungen table-layout:fixed; auf Deine Tabelle hat, musst Du natürlich austesten.

Ich hab mich getäuscht, es DOCH Auswirkungen:

Der von Axel vorgeschlagene (leicht abgewandelte) Code:

<table width="300" cellpadding="0" cellspacing="0" border="1" style="table-layout:fixed;">
<tr>
    <td colspan="1" style="width:30%;"><input type="text" name="test1" value="Kurzer Text" maxlength="255" style="width:100%;"></td>
    <td colspan="1" style="width:30%;"><input type="text" name="test2" value="Langer Test-Text, der nicht komplett in das INPUT-Feld passen sollte, jedoch das Feld nicht weiter als die gesetzte Breite ausdehen soll." maxlength="255" style="width:100%;"></td>
</tr>
<tr>
    <td colspan="2">Das ist ein Test, der eine gewisse Breite hat und innerhalb der Tabelle umbrechen sollte.</td>
</tr>
</table>

macht plötzlich ungeachtet der width-Angabe beide Spalten gleich breit (50%).
Um das zu verhindern, und die Spaltenbreite festzulegen, muss man colgroup und col verwenden wie folgt:

<table width="300" cellpadding="0" cellspacing="0" border="1" style="table-layout:fixed;">
<colgroup>
    <col width="30%">
    <col width="70%">
</colgroup>
<tr>
    <td colspan="1"><input type="text" name="test1" value="Kurzer Text" maxlength="255" style="width:100%;"></td>
    <td colspan="1"><input type="text" name="test2" value="Langer Test-Text, der nicht komplett in das INPUT-Feld passen sollte, jedoch das Feld nicht weiter als die gesetzte Breite ausdehen soll." maxlength="255" style="width:100%;"></td>
</tr>
<tr>
    <td colspan="2">Das ist ein Test, der eine gewisse Breite hat und innerhalb der Tabelle umbrechen sollte.</td>
</tr>
</table>

Dann funktioniert alles!

Gruss,
GodfatherX