Showing white space ‘as-is’ in HTML

A common gripe about HTML rendering is that white spaces are not preserved.

For e.g. giving

<table><tr><td>This is       a                       test</td></tr></table>

will end up being shown as ‘This is a test’.

To show the spaces, people generally convert spaces to & nbsp;

to preserve the spaces. Instead, a CSS property ‘white-space’ can be used.

For e.g. to preserve the spaces, do this:

<table><tr><td style = "white-space:PRE">This is       a                       test</td></tr></table>

This will display preserve the white spaces and show

'This is            a                        test'

on the browser. We need to include a !DOCTYPE to make use of ‘white-space:pre’ property on IE.

Advertisements

Tags:

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s


%d bloggers like this: