CSS-перенос слов: разрыв слов не работает на IE9

Question

У меня есть небольшой скрипт css, который заставляет <a> пометить перенос слов в div. Он работал нормально на FF, Chrome, но не работал на IE9. Как я могу это исправить?

.tab_title a{
    word-wrap: break-word;
} 

Answer 1

Для аналогичной проблемы я использовал display: inline-block для тега <a>, что, кажется, помогает. И word-break: break-all, поскольку я был обеспокоен тем, что длинные URL-адреса не переносятся.

Итак, это в вашем случае по существу ...

.tab_title a {
    display: inline-block;
    word-break: break-all;
} 

Answer 2

Это может помочь: http://www.last -child.com / слово-обертывание-в-интернет-исследователь /

Другой пост также предлагает применить к нему word-break:break-all и word-wrap:break-word.

Answer 3

Для меня это работало как в Chrome, так и в IE с:

.word-hyphen-break {
  word-break: break-word;
  word-wrap: break-word;
  width: 100%;
}

как это не нужно настраивать конкретную ширину.

Answer 4

Попробуйте это:

.tab_title a{
    -ms-word-break: break-all;
    word-break: break-all;
    word-break: break-word;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto;
} 

Answer 5

word-wrap: word-break; работает только в ff и chrome, а не в IE8 и IE9.
word-break: break-all; тоже не работает.

Answer 6

Я удаляю тег привязки после .tab_title класса, и он работает

Answer 7

У меня был хороший успех в Chrome, Firefox и IE с использованием:

word-break: break-word;
word-wrap: break-word;

В моем проблемном случае я использовал:

display: table-cell;

, и мне пришлось включить

max-width: 440px;

, чтобы получить упаковку во всех браузерах.В большинстве случаев максимальная ширина не была необходима.Использование

word-break: break-all;

не очень хорошо работает в IE, потому что, хотя длинные слова без пробелов будут переноситься, короткие слова также прекращают перенос в пробелах.

Answer 8

Недавно я боролся с этим в Angular между IE / Edge & Chrome. Вот что я нашел, работал для меня

  overflow-wrap: break-word;
  word-wrap: break-word;

Это дало мне лучшее из обоих. Это сломало бы слово, которое было слишком длинным, но в отличие от переноса слов, оно не сломало бы слово.

Answer 9

Я только что понял, что перенос слов: разрывное слово работает только частично в IE8 и IE9. Если у меня есть строка слов с пробелами, то эта строка переносится. Но если моя строка состоит из одного длинного слова, это заставляет родительский / контейнерный элемент расширяться в соответствии с его шириной