Search code examples
htmlmultilinetabular

Making text appear in html table cell with line breaks


I'm working on a razor pages website with a database behind it. One of the database columns needs to contain multiline text. The text is entered by the user when creating a database entry so could be editted to include
tags or such like. When displayed on the webpage, this multiline data appears in a table cell like so:

<dd>
    @Html.DisplayFor(model => model.SpecSelResult.Output)
</dd>

However, line breaks do not show up. If I enter the text as 'Line1
Line2
Line3', when inspecting the element in chrome I see the following:

<dd>
    ::before
    "
       Line1<br> Line2<br> Line3
    "
    ::after
</dd>

And this displays as

Line1<br> Line2<br> Line3

so the
tags are ineffective. Ideally I'd just be able to copy and paste the text from notepad or notepad++ and not add
tags, but adding the tags wouldn't be too bad if it worked. Can anybody tell me how to get the data to show up multi-lined?

EDIT:

I've found this approach works if I add <br> tags but I'd still appreciate a solution without those:

<dd>
   @Html.Raw(Model.SpecSelResult.Output)
</dd>

Solution

  • This resolved the problem for me:

    <pre>@Html.DisplayTextFor(model => model.SpecSelResult.Output)</pre>