CSS White-Space Property

Why CSS white-Space Property is used?: The white-space property tells you how white-space inside an element is used.

White-Space Property Details

White-Space Property CSS Syntax

white-space: normal|nowrap|pre|pre-line|pre-wrap|initial|inherit;

White-Space Property JavaScript Syntax

object.style.whiteSpace="nowrap"

White-Space Property Example

Demonstrating different values for white-space property:

p.a
{
white-space: nowrap;
}
p.b
{
white-space: normal;
}
p.c
{
white-space: pre;
}

Example Explanation

1.normal Sequences of whitespace declared as a single whitespace. (This is the default)

2.nowrap Sequences of whitespace declared as a single whitespace. The text will be on the same line until you declare a <br> tag.

3.pre Whitespace is preserved by the browser. The text will only end on line breaks and acts like <pre> tag in HTML.

4.pre-line Sequences of whitespace will be declared as a single whitespace. The text will end when necessary and line breaks.

5.pre-wrap Whitespace is preserved by the browser. The text will end when necessary and line breaks

6.initial Sets the property to its default value.

7.inherit Inherits the property from its parent element.