【IE10】テキストエリア内の一行目で謎の折り返しが勝手に発生します

Question

textarea {
word-break: break-all;
}

こちらの指定でchromeでは直りました。
IEではかわらずの状態で、こちらの入力内容で伸ばし棒をコピペしていくと折り返してしましまいます。。。

textarea { 
width: 100%; 
height: 150px; 
padding: 10px; 
font-size: 12px; 
font-size: 1.2rem; 
resize: none; 
overflow-x: hidden; 
-webkit-appearance: none; 
border: 1px solid #ececec; 
word-break: break-all; 
}

こちら現在の指定です

Comments

[takito]

HTML側も提示ください

[kei344]

https://teratail.com/questions/69766 とりあえずこちらを閉じてから質問されては？

[arue]

kei344さん 失礼致しました。完了になってしまうので残していました。使用方法を改めます

Answer 1

######検証しました
添付のCSSに

<textarea>あああ────────────────────────────────────────────────────────────────────────────────────────────────────────────────</textarea>

のHTMLをつけて検証してみました。

今手元にIE10の実機が無いので何とも言えませんが、
実機のIE11上では問題なく、エミュレータ上のIE10以下でも問題なくbreak-allが効いて強制改行されずに連続した文字列になっている事が確認できました。

該当CSSではない箇所またはHTMLに原因があるのかもしれません。

######バグではなく仕様
ちなみにこの現象はバグなどではなく、
例えばinternationalizationなどの長い英単語が途中で折り返されて読む側が意味喪失しないようにするために、あえてを改行させる文章校正上の仕様です。
break-allで強制改行させてしまう事は、必ずしも良いこととは限りません。
※Wordなどで文章を打っても同じようになる

これが適用される文字の種類は「アルファベットや一部の記号」のみで、
制作段階で仮のテキスト文字をaaaaaaaや──────などにした場合に、誰しも気になる挙動ではあります。
しかし、実際の運用を考えた場合にこれらの特定のアルファベットや記号が連続して挿入される文章というものはほぼ無い（URLくらいのもの）ので、一部の環境によってbreak-allが効く効かない、または使う使わないという問題は、WEB業界ではある程度は妥協して柔軟に対応してきた部分ではあります。

Comments

[arue]

明確なご回答ありがとうございました！お話しいただいた通りここは妥協点という事で進めて参ります！