How to show multiline text in a table cell
I want to show a paragraph from database into a table cell.
The result is a large 1 line, ignoring how its organised in database. ignoring 'enters' for example (new lines)
I want to show it exactly according to how it's written in database.
For example if paragraph is saved like this:
hello ,
my name is x.
I want it to be showed exactly like that, instead of:
hello, myname is x.
You want to use the CSS white-space:pre
applied to the appropriate <td>
. To do this to all table cells, for example:
td { white-space:pre }
Alternatively, if you can change your markup, you can use a <pre>
tag around your content. By default web browsers use their user-agent stylesheet to apply the same white-space:pre
rule to this element.
The PRE element tells visual user agents that the enclosed text is "preformatted". When handling preformatted text, visual user agents:
- May leave white space intact.
- May render text with a fixed-pitch font.
- May disable automatic word wrap.
- Must not disable bidirectional processing.
style="white-space:pre-wrap; word-wrap:break-word"
This would solve the issue of new line. pre tag would add additional CSS than required.
Wrap the content in a <pre>
(pre-formatted text) tag
<pre>hello ,
my name is x.</pre>
Two suggestions to solving this problem:
SOLUTION 1: <div style="white-space:pre;">{database text}</div>
or <pre>{database text}</pre>
This is good solution if your text has no html tags or css properties. Also allows to maintain tabs for example.
SOLUTION 2: Replace \n
with <p></p> or <br/>
This is a solution if you would just like to add break-lines, without losing other text properties or formatting.
An example in php would be $text = str_replace("\n","<br />",$database_text);
You can also use <p></p>
or <div></div>
, but this requires a bit more text parsing.