web-dev-qa-db-fra.com

Le retour à la ligne d'Internet Explorer 11 ne fonctionne pas

Il semble que le wrapping Word ne fonctionne plus pour les éléments textarea dans IE 11. Dans IE 10 et les versions antérieures, le wrapping FF, Safari et Chrome Word fonctionne comme prévu.

IE 11 n'implémente pas de wrapping Word. J'ai essayé d'ajouter "wrap = hard" à la balise textarea et d'ajouter "Word-wrap: normal;" au CSS.

Quelqu'un at-il rencontré ce problème? Si oui, avez-vous trouvé une solution? Windows diffuse cette mise à jour et le comportement incohérent devient un problème.

Merci pour toute l'aide que vous pouvez apporter.

Voici mon tag textarea actuel

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

Ceci est mon CSS calculé

-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;
htmlcssinternet-explorer
41
wesley

Afin de garantir que la réponse soit évidente pour les visiteurs de cette question à l'avenir: le PO ( wesley ) a répondu à la question lui-même dans les commentaires suivants:

Le problème est dû au fait qu'Internet Explorer 11 fait en sorte que les éléments textarea héritent de la propriété white-space appliquée au parent direct.

La résolution consiste à appliquer white-space: pre-wrap à la zone de texte, comme indiqué par Jean-François Beauchamp .

70
johnkavanagh

ajouter du CSS 

 {width: 100%}

cela va envelopper le texte à sa balise

9
Ylli Gashi

J'avais un problème similaire et je l'ai résolu en changeant le style Word-Wrap en Word-Break:

{ Word-break: break-all; }
4
Phil

Je suis arrivé ici pour un problème différent où Word-wrap ne fonctionnait pas sur IE11;

La solution {width: 100%} a fonctionné pour moi.

3
bpylearner

Notez que IE11, en mode de compatibilité, n’enroule pas correctement les lignes. Pour y arriver, cliquez sur Alt, Outils, Options Internet, Sécurité, Intranet local, Sites, Avancé. Voir ce qui est dans cette liste.

0
BenV136