Maintain whitespace when displaying text from database

Question

I'm putting up a table that displays values from a table. One of the fields comes from a textarea input.

If I use this method then whitespace is maintained:

@Html.TextAreaFor(model => model.goalDescr, new { cols="90", rows="3", @readonly = "true"})

--example:

hey

there

--end example

However, I don't like that view so much as it still looks like a form field. I tried to use displayfor but the white space is removed and all text is one one line.

@Html.DisplayFor(model => model.goalDescr)

--example:

hey there

--end example

Is there a way to display text in my view in, outside of a form element, and maintain white space?

Answer 1

As Steve B's answer says, you can use <pre> to maintain whitespace.

If however you don't like the auto-formatting <pre> does and want to keep your inherited styling simply use a <span> or <div> with the style="white-space:pre-wrap;" attribute. I find this to be a more elegant solution.

Live demo

Answer 2

wrap your DB content into a pre tag

<pre>
 All whitespaces      and linebreaks
are preserved

</pre>