Rendering New Lines in HTML

This forum allows users to post and respond to "How Do I Do ....." questions. The information contained in this forum has not been validated by K-Rise Systems and, as such, K-Rise Systems cannot guarantee the accuracy of the information.
JefferyD
Posts: 177
Joined: August 31st, 2021, 11:37 am
Contact:

Rendering New Lines in HTML

Unread post by JefferyD »

New line characters do not display when rendering HTML by default. If that is not desired, then some ways to include new lines are:
  1. 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.
  2. Adjust the white-space style of an element to change the default behavior of ignoring new lines.
In this example, the text entered into the "Input" text area is copied directly into the other elements:
image.png
  • 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.
word count: 205

Tags:
Post Reply