title: Wrapping text inside input type="text" element HTML/CSS
body: <p>The HTML shown below,</p>
  
  <pre><code>&lt;input type="text"/&gt;
  </code></pre>
  
  <p>is displayed in a browser like so:
  <br/>
  <img src="https://i.stack.imgur.com/rhZPL.png" title="This is how the above HTML is displayed in a browser.">
  <br/><hr/>
  When I add the following text,</p>
  
  <blockquote>
    <p>The quick brown fox jumped over the lazy dog.</p>
  </blockquote>
  
  <p>Using the HTML below,</p>
  
  <pre><code>&lt;input type="text" value="The quick brown fox jumped over the lazy dog."/&gt;
  </code></pre>
  
  <p>it is displayed in a browser like so:
  <br/>
  <img src="https://i.stack.imgur.com/PT6LL.png" title="This is how the above HTML is displayed in a browser.">
  <br/><hr/>
  But I would like it to be displayed in a browser like so:
  <br/>
  <img src="https://i.stack.imgur.com/vv9Uy.png" title="This is how I would like the above HTML to be displayed in a browser."/>
  <br/><hr/>
  I want the text in my input element to wrap.
  Can this be accomplished without a textarea?</p>