хорошо, теперь я ясно вижу, что это повторяется в IE.
Кажется, это ошибка в IE (IE имеет пресловутые проблемы с процентами) в зависимости от сценария, где:
- вход находится в таблице
- И вход измеряется в процентах
- И вход имеет значение по умолчанию (т.е. в разметке), которое превышает ширину
Поэтому существует несколько очевидных обходных путей:
- вместо этого поместите ввод в плавающую
<div> схему (я бы сделал это, если это семантически правильно)
- ширина размера в единицах, таких как
em (предпочтительно) или px (если ваш дизайн может себе это позволить)
- внедрить значение в клиентский скрипт после загрузки (это плохое решение, не делать это)
и один неочевидный обходной путь, который я бы порекомендовал, если вам потребуется и таблица и проценты:
- правило CSS только для IE
width: expression(this.parentNode.offsetWidth*0.9);
Надеюсь, это поможет.
(предыдущий ответ, запрашивающий код удален)
Редактировать: фрагмент кода на основе вашего образца, работает в IE + FF
<style>
/* table method */
table {width: 100%;}
th {width: 25%; text-align: center; font-weight: 700;}
td {height: 24px; width: 25%;}
td input {overflow: hidden; width: 90%; }
/* IE only correction */
* html td input {width: expression(this.parentNode.offsetWidth*0.9);}
/* float method */
#foo {width: 100%;background:blue;}
#foo div {float:left; width: 25%;}
#foo div input {width: 90%;}
</style>
<table>
<thead>
<tr>
<th>Last</th>
<th>First</th>
<th>Middle</th>
<th>Email</th>
<tr>
</thead>
<tbody>
<tr>
<td>
<input maxlength="256" type="text" name="additionalContact" value="aaaaaaaaaaa aaaaaaaaaaaaaaaaaaa aaaaaaaa aaaaaaaaaaaa aaaaa aaaaaaaaaaaaaaa" />
</td>
<td>
<input maxlength="256" type="text" name="additionalContact" value="aaaaaaaaaaaaaaaaaaaaaaaaaa" />
</td>
<td>
<input maxlength="256" type="text" name="additionalContact" value="aaaaaaaaaaaa aaaaaaaa aaaaaaaaaab bbbbbbbb bbbbbbbbbbbbbbbb" />
</td>
<td>
<input maxlength="256" type="text" name="additionalContact" value="aaaaaaaa aaaaaa aaaaaaa aaaaa" />
</td>
</tr>
</tbody>
</table>
<div id="foo">
<div>
<input maxlength="256" type="text" name="additionalContact" value="aaaaaaaaaaa aaaaaaaaaaaaaaaaaaa aaaaaaaa aaaaaaaaaaaa aaaaa aaaaaaaaaaaaaaa" >
</div>
<div>
<input maxlength="256" type="text" name="additionalContact" value="aaaaaaaaaaaaaaaaaaaaaaaaaa" >
</div>
<div>
<input maxlength="256" type="text" name="additionalContact" value="aaaaaaaaaaaa aaaaaaaa aaaaaaaaaab bbbbbbbb bbbbbbbbbbbbbbbb" >
</div>
<div>
<input maxlength="256" type="text" name="additionalContact" value="aaaaaaaa aaaaaa aaaaaaa aaaaa" >
</div>
</div>