Rendering New Lines in HTML
Posted: October 13th, 2022, 5:11 pm
New line characters do not display when rendering HTML by default. If that is not desired, then some ways to include new lines are:
- Use a text area in read only mode. Text areas honor new line characters, and setting them to be read only can be an option if it should not accept any user input.
- Adjust the white-space style of an element to change the default behavior of ignoring new lines.
- Read Only Text Area - This looks identical to the "Input" text, but cannot be edited by the user. CSS styling can also be applied to remove the border, change the coloring, or alter it in any other to distinguish it from editable text areas.
- Default Label - This shows what the text would look like by default.
- Label With Wrapping - This shows what the text would look like with "white-space" styling set to "break-spaces" (as shown in the green box). Some other values like "pre", "pre-wrap", and "pre-line" would also preserve the new line characters but while handling other kinds of text wrapping differently. More information can be found here.