Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to show cell's carriage return as new line?

Tags:

html

css

Is there any way to define a CSS class which would substitute the component's text's carriage returns (as coming from the DB, for example) with <br/> so that they are displayed as new line?

Currently, I have a table whose one field is a user entered note they enter in a popup form. They can make paragraphs in the textarea and the data loaded in the form text area for editing shows proper new lines but when it is updated and the popup closed, the main page's data table naturally does not convert the new line carriage return into new HTML line. My question is is there a way to do it via CSS?

I am using CSS word-wrap: break-word to display the note content in my table cell so that it wraps text into the new line within the cell, however, it does not do it for user entered new lines using
, which are BTW stored and retrieved fine in the DB.

like image 645
amphibient Avatar asked Sep 18 '15 21:09

amphibient


People also ask

How do you show carriage return in Excel?

We will press the excel shortcut key ALT + ENTER to insert the carriage return character in excel cell. As we press the “ALT + ENTER” key, it pushes the content in front of the selected data to the new line by inserting a carriage return. Now again, place a cursor in front of the third line data.

How do you return to the next line in a cell?

Double-click the cell in which you want to insert a line break (or select the cell and then press F2). Click the location inside the selected cell where you want to break the line. Press Alt+Enter to insert the line break.

How do I replace a character with a new line in Excel?

Select the cells that you want to search. On the keyboard, press Ctrl + H to open the Find and Replace dialog box, with the Replace tab active. On the Replace tab, click in the Find What box. On the keyboard, press Ctrl + J to enter the line break character.

How do you add a carriage return in Excel Find and Replace?

If you are using Alt + Enter to add carriage return within a cell, you can remove those by using Excel Find and Replace tool. Select a cell within which you have carriage return/line break and Press Ctrl + H to open up excel Find & Replace window.


1 Answers

Might be a little late, but following up on Marc B's comment at the end, if you use white-space: pre-line or white-space: pre-wrap that seems to preserve line breaks and line wrapping at the same time.

  • pre-line: Collapses multiple sequences of white space
  • pre-wrap: Preserves multiple sequences of white space

MDN link: https://developer.mozilla.org/en/docs/Web/CSS/white-space

like image 117
Shakeel Soogun Avatar answered Sep 24 '22 07:09

Shakeel Soogun