title: Multiple spaces overflowing textarea in Chrome/Firefox
body: <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;textarea rows="4" cols="50"&gt;
  Enter multiple spaces and after a point of time it breaks into newline in IE but it overflows text area in Chrome
  &lt;/textarea&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>When entering multiple spaces inside text area in IE/EDGE after a particular point it breaks into new line .</p>
  
  <p>But in Chrome/Firefox the multiple spaces inside textarea overflows the textarea instead of breaking into newline. I also tried by using white-space:pre but it creates horizontal scrollbar.I don't want scrolls inside my text area . 
  Is there any CSS property to stop overflowing textarea.
  Kindly help me to preserve whitespace inside text area in Chrome /Firefox also.
  This is the html code for textarea component</p>
  
  <p>Thanks in Advance</p>