whiteSpace Property - Javascript CSS Style Property

Javascript examples for CSS Style Property:whiteSpace

  1. HOME
  2. Javascript
  3. CSS Style Property
  4. whiteSpace

Description

The whiteSpace property sets or gets how to handle tabs, line breaks and whitespace in a text.

Property Values

ValueDescription
normal whitespace will collapse into a single whitespace. Wrap Text when necessary. Default value
nowrap whitespace will collapse into a single whitespace. No wrap for Text.
pre Acts like the <pre> tag
pre-line whitespace will collapse into a single whitespace. Text will wrap when necessary, and on line breaks
pre-wrap Whitespace is preserved. Text will wrap when necessary, and on line breaks
initial Sets this property to its default value.
inherit Inherits this property from its parent element.

Technical Details

Item Value
Default Value: normal?
Return Value: A String, representing how white-space inside an element is handled
CSS VersionCSS1

Specify that the text in the <div> element will never wrap:

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html>
<body>

<div id="myDiv" style="white-space:nowrap;">
This is some text. This is some text. This is some text.This is some text. This is some text. This is some text.This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.This is some text. This is some text. This is some text.This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.This is some text. This is some text. This is some text.
</div>/*from   w w  w .j av  a  2  s .  c  o m*/
<br>

<button type="button" onclick="myFunction()">Test</button>

<script>
function myFunction() {
    document.getElementById("myDiv").style.whiteSpace = 'pre';
}
</script>

</body>
</html>

Related Tutorials