basarat
basarat

Reputation: 275927

Preserve whitespace in html

In xaml I can make whitespace relevant (that is not ignored) by using the xml:space attribute on a tag. Reference: http://msdn.microsoft.com/en-us/library/ms788720.aspx

Is there any way to make whitespace relevant in html?

Update:

Finally went with:

<p style="white-space: pre">
Hi   This
    is
 an    example
</p>

Although Aziz shaikh solution also works fine as well.

Upvotes: 1

Views: 2758

Answers (5)

Hoylen
Hoylen

Reputation: 17040

It is not about "relevance" but how the browser has been told to render the text. The pre tag renders whitespaces without collapsing them.

This rendering property can be controlled on any element by the CSS white-space property.

p.foobar { white-space: pre }

<p class="foobar">abc   def</p>

Upvotes: 3

Shebin
Shebin

Reputation: 3468

you can specify the white space property in css

Upvotes: 4

Aziz Shaikh
Aziz Shaikh

Reputation: 16524

You can use <pre> with css styling. Check this fiddle as demo.

<pre style="font:inherit">
    This       is       a
              pre
    test
</pre>

Upvotes: 2

Sudh
Sudh

Reputation: 1335

Don't know whether I understand your question correctly, but if you want to preserve the White Spaces in html , pre is the tag you are looking for

  <html>
    ....

    <pre>
      hi   this
         is
      an    example
    </pre>
    </html>

it will provide you:

 Hi   This
    is
 an    example
 

Upvotes: 7

James Wilcox
James Wilcox

Reputation: 5663

The usual way is using a non-breaking space, as in &nbsp;, for horizontal whitespace, and <br> for a line break.

Upvotes: 2

Related Questions