Я ищу кросс-браузерный способ обертывания длинных фрагментов текста, у которых нет разломов (например, длинных URL-адресов) внутри div с заранее определенными ширинами.
Вот некоторые решения, которые я нашел в Интернете, и почему они не работают для меня:
- переполнение: скрытое/авто/прокрутка. Мне нужен весь текст, который будет видимым без прокрутки. Div может расти вертикально, но не горизонтально.
- Инъекция и застенчивость; в строку через js/server-side - & shy; теперь поддерживается FF3, но копирование и вставка URL-адреса с помощью & shy; в середине не будет работать в Safari. Кроме того, насколько мне известно, нет чистого метода измерения ширины текста, чтобы найти наилучшие смещения строк, чтобы добавить эти символы (там один хакерский путь, см. Следующий пункт). Другая проблема заключается в том, что масштабирование в Firefox и Opera может легко нарушить это.
- сбрасывая текст в скрытый элемент и измеряя offsetWidth - связанный с элементом выше, он требует добавления дополнительных символов в строку. Кроме того, измерение количества прерываний, требуемых в длинном тексте, может потребовать тысячи дорогостоящих вставок DOM (по одной для каждой длины подстроки), что может эффективно заморозить сайт.
- с использованием моноширинного шрифта - снова, масштабирование может испортить вычисления ширины, и текст не может быть оформлен свободно.
Вещи, которые выглядят многообещающими, но не совсем там:
- word-wrap: break-word - теперь часть рабочего проекта CSS3, но он не поддерживается либо Firefox, Opera или Safari. Это было бы идеальным решением, если бы оно работало во всех браузерах сегодня: (
- инъекции <wbr> теги в строку через js/server-side - копирование и склеивание URL-адресов работает во всех браузерах, но у меня все еще нет хорошего способа измерить, где положить перерывы. Кроме того, этот тег недействителен HTML.
- добавление перерывов после каждого символа - это лучше, чем тысячи вложений DOM, но все же не идеально (добавление элементов DOM в документ сжигает память и замедляет селекторные запросы, между прочим).
Есть ли у кого-нибудь больше идей о том, как решить эту проблему?