line breaks in <textarea> and <pre>

Question

This is a textarea. As you can see if the end is reached with letters it continues in a new line. Then i click uptade details, the letters are inserted into a database.

Here at Info the text from the textarea is shown. It is a pre. But it doesnt make the line breaks. How can i change the code so it gets shown in Info exactly how the text is formated in the textarea?

<textarea style=" width: 600px; max-width: 660px; height: 200px;  border: 1px solid; border-radius:4px;" placeholder="Beschreibe dich selbst genauer..." type="text" name="info">  </textarea>


<pre style="background-color: #93b9de54; max-width: 787px; font-family: Helvetica, Arial, sans-serif;">  </pre>

Answer 1

Try setting the white-space css attribute to pre-wrap for the pre tag i.e

/HTML/

Content here

/* CSS */

pre { white-space: pre-wrap; }

This will preserve line breaks and wrap text whenever necessary. You can read more about the white-space css attribute here