テキストエリアにスペースを入れずに入力し続けると、divに表示されるテキストエリアの表示がdivの幅を超えますか？

テキストエリアにスペースを入れずに入力し続けると、divに表示されるテキストエリアの出力がdivの幅を超えますか？しかし、スペースで入力するときに問題は起こりません。テキストエリアにスペースを入れずに入力し続けると、divに表示されるテキストエリアの表示がdivの幅を超えますか？

function grab(){ 
 
     var x= document.getElementById("text").value; 
 
     document.getElementById("replace").innerHTML = x; 
 

 
     }

<body> 
 
<form> 
 
<textarea id="text" onKeyUp="grab();" onKeyPress="grab();"></textarea><br> 
 
</form> 
 
<div id="replace" style="height: 20px; width: 100px;">1</div><br> 
 
</body>

出典

2017-09-17 ycd

それはoverflowsテキスト外ではライン - をDIVないので、何の間隔は、あなたの言葉の間に追加されていないとブレークが追加されているので、CSS word-wrapプロパティを追加してlong wordを改行し、divの最後に到達するとすぐに次の行に折り返します。

ワードラップ -

ワードラップ性は、長い単語が次の行に分割され、ラップすることができることを可能にします。

function grab() { 
 
    var x = document.getElementById("text").value; 
 
    document.getElementById("replace").innerHTML = x; 
 
} 
 

 
var ta = document.querySelector("form > textarea"); 
 
ta.addEventListener("keyup", grab);

#replace { 
 
    width: 200px; 
 
    height: 100px; 
 
    border: solid; 
 
    word-wrap: break-word; 
 
}

<form> 
 
    <textarea id="text"></textarea> 
 
    <br> 
 
</form> 
 
<div id="replace">1</div> 
 
<br>

出典

2017-09-17 11:12:14 frnt

それが原因であなたはCSSプロパティを使用して壊す可能性がロングワードのだ@ycd。 – frnt

ありがとうございます！ – ycd

ようこそ@ycd :-) – frnt

テキストエリアにスペースを入れずに入力し続けると、divに表示されるテキストエリアの表示がdivの幅を超えますか？

答えて

関連する問題