почему ширина ввода 100% в автоматическом макете таблицы увеличивается в IE7? - PullRequest
Новая
       22

почему ширина ввода 100% в автоматическом макете таблицы увеличивается в IE7?

0 голосов
/ 16 ноября 2010

У меня есть таблица с шириной ограничения и ячейка таблицы с процентной шириной. В ячейке у меня input или textarea с style="width:100%", без полей, отступов и границ, но с более длинным содержимым без пробелов . Почему IE7 и IE6 расширяют ввод, чтобы соответствовать длине контента?

Применение table-layout: fixed к таблице не вариант - я ретранслирую расширение столбцов, чтобы сохранить их содержимое (например, столбцы с метками ввода должны соответствовать длине меток).

Полный пример приведен ниже. Я проверял, что действительно HTML5 отображается в стандартном режиме. 

<!doctype html>
<meta charset="utf-8" />
<title>ie6 ie7 input bug</title>
<style>

  input, textarea {
    width: 100%;
    margin: 0; padding: 0; border: 0;
  }

  table {
    background: yellow;
    width: 500px;
  }

</style>
<body>
  <table>
    <tr>
      <td style="width: 15%;">
        <input value="VeryLongTextWithoutSpaces" />
      </td>
      <td> <br/><br/><!-- give height --> </td>
    </tr>
  </table>
  <br/> <!-- textarea example -->
  table>
    <tr>
      <td style="width: 15%;">
        <textarea>VeryLongTextWithoutSpaces</textarea>
      </td>
      <td> <br/><br/><!-- give height --> </td>
    </tr>
  </table>
</body>

1 Ответ

0 голосов
/ 16 ноября 2010

Я обнаружил, что применение line-height для ввода помогает , если , то вход никогда не содержит длинных слов. Это может быть достаточно для меня (я могу рассчитать правильную высоту строки), но приветствуются другие решения, которые могут быть более подходящими для других.

наконец я нашел решение здесь textarea с шириной 100% игнорирует ширину родительского элемента в IE7 : добавление brutal word-break:break-all; является решением.

...