Internet Explorer 11 перенос слов не работает

похоже, что перенос слов больше не работает для элементов textarea в IE 11. В IE 10 и более ранних версиях FF, Safari и Chrome Word wrapping работают так, как ожидалось.

IE 11 не реализует перенос слов. Я попытался добавить" wrap=hard "в тег textarea, а также добавить" word-wrap: normal; " в CSS.

кто-нибудь сталкивался с этой проблемой? Если да, то нашли ли вы решение? Windows выталкивает это обновление, и непоследовательное поведение становится проблема.

Спасибо за любую помощь вы можете предоставить.

вот мой текущий тег textarea

<textarea class="wrklst-report_text" id="report_text_6586427" name="report_text[6586427]" title="Report Box" data-exam_seq="6586427" style="width:95%;"></textarea>

Это мой вычисляемый CSS

-webkit-appearance: textarea;
-webkit-rtl-ordering: logical;
-webkit-user-select: text;
-webkit-writing-mode: horizontal-tb;
background-color: rgb(255, 255, 255);
border-bottom-color: rgb(0, 0, 0);
border-bottom-style: solid;
border-bottom-width: 1px;
border-image-outset: 0px;
border-image-repeat: stretch;
border-image-slice: 100%;
border-image-source: none;
border-image-width: 1;
border-left-color: rgb(0, 0, 0);
border-left-style: solid;
border-left-width: 1px;
border-right-color: rgb(0, 0, 0);
border-right-style: solid;
border-right-width: 1px;
border-top-color: rgb(0, 0, 0);
border-top-style: solid;
border-top-width: 1px;
color: rgb(0, 0, 0);
cursor: auto;
display: inline-block;
flex-direction: column;
font-family: Verdana, Arial, sans-serif;
font-size: 16px;
height: 300px;
letter-spacing: normal;
line-height: normal;
margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
padding-bottom: 2px;
padding-left: 2px;
padding-right: 2px;
padding-top: 2px;
resize: both;
text-align: start;
text-indent: 0px;
text-shadow: none;
text-transform: none;
white-space: pre-wrap;
width: 950px;
word-spacing: 0px;
word-wrap: break-word;
writing-mode: lr-tb;

6 ответов


для того, чтобы убедиться, что ответ очевиден для людей, посещающих этот вопрос в будущем: ОП (Уэсли) ответил на вопрос сам в комментариях под вопросом:

причиной проблемы является то, что Internet Explorer 11 является textarea элементы наследуют все, что white-space свойство применяется к прямой родитель.

разрешение применять white-space: pre-wrap в textarea, как определено Жан-Франсуа Бошан!--5-->.


добавить CSS

 {width: 100%} 

это будет обернуть текст в тег


У меня была аналогичная проблема, и я решил ее, изменив стиль word-wrap на стиль word-break:

{ word-break: break-all; }

Я попал сюда для другой проблемы, когда word-wrap не работал над IE11;

на {width: 100%} решение сработало для меня.


обратите внимание, что IE11 в режиме совместимости не будет правильно переносить строки. Чтобы добраться до него, нажмите Alt, Tools, Internet Options, Security, Local intranet, Sites, Advanced. Посмотрите, что в этом списке.


я столкнулся с аналогичной проблемой для раскрывающегося списка IE (11.431.16299.0), и я исправил, применив оба ниже стиля

white-space:pre-wrap;
word-break:break-all;