web-dev-qa-db-ja.com

Internet Explorer 11のワードラップが機能していません

IE 11のtextarea要素に対してワードラッピングが機能しなくなったようです。IE 10以前では、FF、Safari、およびChromeワードラッピングは期待どおりに機能します。

IE 11はWordの折り返しを実装していません。 textareaタグに「wrap = hard」を追加し、「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;
45
wesley

将来、この質問を訪れる人々に答えが明白になるように、OP( wesley )は、質問の下のコメントで質問に自分で答えました。

この問題の原因は、Internet Explorer 11がtextarea要素がwhite-spaceプロパティは直接の親に適用されます。

解決策はwhite-space: pre-wrapJean-FrançoisBeauchamp で識別されるように、テキストエリアに。

74
johnkavanagh

cSSを追加

 {width: 100%} 

これはテキストをタグにラップします

12
Ylli Gashi

IE11でワードラップが機能していなかった別の問題のためにここに来ました。

{width: 100%}ソリューションは私のために働いた。

4
bpylearner

同様の問題があり、Wordの折り返しスタイルをWordの改行スタイルに変更することで解決しました。

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

IE11は、互換モードでは、行を正しく折り返さないことに注意してください。それを取得するには、Alt、ツール、インターネットオプション、セキュリティ、ローカルイントラネット、サイト、詳細をクリックします。そのリストにあるものを参照してください。

0
BenV136