У меня есть некоторая строка символов (все только буквенные и редкие символы новой строки, без пробелов или любых других разделителей), которые я хотел бы заполнить в ячейке таблицы до ширины ячейки (варьируется в зависимости от окна size, в примере установлено значение 50%
). Я хочу, чтобы браузер почти не переносил строку при достижении ширины ячейки таблицы, но также приветствовал символы новой строки в строке. Содержимое в ячейке таблицы должно иметь заданную фиксированную минимальную ширину (200px
в примере ниже), что должно привести к появлению вертикальной прокрутки при дальнейшем изменении размера окна. Этот момент, когда окно стало слишком маленьким, я показываю на этом скриншоте:
Я добился необходимого поведения в FF10, используя max-width
вместо td
(игровая площадка), но я не могу t сделать то же самое для IE: он игнорирует max-width
. Более того, у него очень странное поведение, когда max-width
установлено на pre
: рендерер игнорирует фактическую ширину содержимого и считает, что pre
не было обернуто (игровая площадка — сравнение с FF; сообщалось о похожих проблемах здесь и здесь). В худшем случае можно строго зафиксировать содержимое на 200px
(что должно быть применено к pre
для IE, применение к td
не имеет никакого эффекта). Чтобы это исправление затронуло только IE, я попробовал следующий CSS:
pre {
white-space: pre-wrap;
word-wrap: break-word;
width: expression("200px");
}
td.wrap {
color: red;
max-width: 200px;
}
К сожалению, не работает для IE8.
Целевые браузеры: FF9 (и выше), IE7, IE8, Chrome (последние).
Извините, если эта проблема повторяется: я проверил Как мне обернуть текст в тег pre?, Как я могу перенести этот элемент списка в слова?, Невозможно сделать максимальную ширину, Max-Width не работает с таблицей для IE7 и многие другие: для IE не найдено определенного решения.