The white-space
property determines how sequences of whitespace are displayed. You can learn how to use the CSS white-space
property in just a few steps.
Take our Introduction to CSS Training course for free.
See the Course Outline and Registerwhite-space
property and what they do. They are:
Property | Collapses Series of Spaces and/or Tabs in Code | Collapses Line Breaks in Code | Wraps to Fit Containing Box |
normal | Yes | Yes | Yes |
pre | No | No | No |
nowrap | Yes | Yes | No |
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>White-Space</title>
</head>
<body>
<h1>White-Space</h1>
<div style="white-space: normal;">
white-space: normal
white-space: normal
white-space: normal white-space: normal white-space: normal white-space: normal
white-space: normal white-space: normal
</div>
<hr>
<div style="white-space: nowrap;">
white-space: nowrap
white-space: nowrap
white-space: nowrap white-space: nowrap white-space: nowrap white-space: nowrap
white-space: nowrap white-space: nowrap
</div>
<hr>
<div style="white-space: pre;">
white-space: pre
white-space: pre
white-space: pre
</div>
</body>
</html>
This code renders the following:
Webucator provides instructor-led training to students throughout the US and Canada. We have trained over 90,000 students from over 16,000 organizations on technologies such as Microsoft ASP.NET, Microsoft Office, XML, Windows, Java, Adobe, HTML5, JavaScript, Angular, and much more. Check out our complete course catalog.