How to retain line breaks in the HTML5 code block?

I've got this in a Default.aspx page:

   <code>
        $(document).ready(function () {
            $("#clickThis").click(function () {
                alert("Hallo die Welt!");
            });
        });
   </code>

Yet it displays as:

    $(document).ready(function () { $("#clickThis").click(function () { alert("Hallo die Welt!"); }); });

...which is nice when real estate is an issue, but for readability, I would like it to display the code exactly as contained within the tag. How?

Upvotes: 0

Views: 72

Answers (3)

robertc
robertc

Reputation: 75777

If you don't mind everything inside <code> tags respecting whitespace, use this CSS:

code {
    white-space: pre;
}

Demo.

Upvotes: 1

manojtc
manojtc

Reputation: 562

Put < pre> tags around the < code> tags.

Upvotes: 1

Finn
Finn

Reputation: 198

Like this

<pre>
<code>
    $(document).ready(function () {
        $("#clickThis").click(function () {
            alert("Hallo die Welt!");
        });
    });
</code>
</pre>

Upvotes: 1

Related Questions