×

CSS White Space Property

White Space in CSS

The white-space CSS property describes how to show the content inside an element. This property is applied to manage a white space within an element.

Values of White-space Property

The following are the values that can be applied to the elements to show the content.

ValueDescriptionnormalThe normal value is the default value. The necessary text can be wrapped by using this value. The white space sequence will collapse into a specific white space.nowrapThe white space sequence will be collapsed into one particular white space. The text can’t be wrapped to the next line by using this value and can be broken only by using the <br> tag.preIn this value, whitespace is secured by a browser. This value is behaved like a <pre> html tag. The text will be wrapped only by using the line breaks.pre-lineWhite space sequence will be collapsed into a specific white space. The text can be wrapped if necessary, and only when using the line breaks.pre-wrapIn this value, whitespace is secured by a browser. The text will be wrapped only by using line breaks.initialThis property can be set-up as a default value by using this value.inheritIt can acquire the property from its parent element.

Example of White Space

Take a look on the following example of white space:

<!DOCTYPE html>
<html>
<head>
<style>
p
{
 white-space: pre;
}
</style>
</head>
<body>
<p>
Write any text..Write any text..Write any text..
Write any text..Write any text..Write any text..
Write any text..Write any text..Write any text..
Write any text..Write any text..Write any text..
Write any text..Write any text..Write any text..
</p>
</body>
</html>

Output:

← Prev Next →


Related Topics

Internal CSS

What is CSS? CSS stands for Cascading Style Sheet.CSS is used to apply styling the HTML elements.With CSS user can add or change color, font-size and font-family. It also helps user...

4 minutes read.

CSS Loader

CSS Loader The loader is the animation that can alert a visitor regarding the loading of the page. We need to wait for some time. It will be helpful if any...

4 minutes read.

CSS Display

CSS Display: The CSS Display property is one of an essential property among all other properties of CSS. The display property specifies how the HTML elements should be displayed on...

4 minutes read.

CSS Inline

What is CSS? CSS is an acronym for Cascading Style Sheets. CSS is the language that we use to style an HTML document. It specifies how HTML components should appear. CSS...

4 minutes read.

CSS White Space Property

White Space in CSS The white-space CSS property describes how to show the content inside an element. This property is applied to manage a white space within an element. Values of White-space...

2 minutes read.

CSS Animation

CSS Animation: The animation property of CSS is applied to make animation over any webpage. It is used as the animation replacement made by JavaScript and Flash. Rules of CSS3 @keyframes The...

3 minutes read.

CSS Width

CSS Width The width property in CSS sets the content width of area of the element. These properties do not provide margin and border features. It is used to set the...

1 minute read.

What is Bootstrap CSS?

Bootstrap: - Bootstrap is a CSS framework that is free to use and is used for the front-end development of the website in a faster and easier way. Bootstrap was released as...

3 minutes read.

CSS Text-align

Text-align The text-align property of CSS sets the table-cell box’s horizontal alignment or any block element. The text-align property is the same as the CSS property vertical-align but towards any horizontal...

1 minute read.

CSS Margin

CSS Margin: The CSS margin property is employed to describe the space throughout the elements. It clears the range throughout the element. These properties do not have a background color...

2 minutes read.

CSS Introduction

CSS stands for Cascading Style Sheet. It is a design language which is used to design the web pages. It was developed by Håkon Wium Lie on October 10, 1994. It provides...

1 minute read.

CSS Background Color

It is one of the CSS properties to apply styling to html elements.This property is used to apply the background color to any HTML element.The background of an element includes...

2 minutes read.

How to edit CSS in WordPress

Developing a new website or blog is a difficult undertaking. We want to create something that the consumers will adore, but we might not want the setting to take months and...

7 minutes read.

How to create blinking text using CSS

The blinking effect is used in HTML and CSS to take the attraction towards a particular word or section. If you need such a blinking effect, we need to take...

2 minutes read.

How to get rid/remove of bullet pioints in CSS

We include a list of items on the web pages that were sometimes numbered and sometimes bulleted in various styles. In HTML, there are two kinds of lists: ordered and unordered...

3 minutes read.

CSS Justify Content

Justify Content: These properties are applied for the alignment of items of a flexible box container if any item does not cover every available space over the main-axis, i.e., horizontally....

4 minutes read.

CSS Box-shadow

CSS Box-shadow This property is referred to include effects as shadow-like around an element’s frame. Syntax box-shadow: h-offset v-offset blur spread color |inset|inherit|none; Property values Following are the various property values which can be used...

3 minutes read.

Css Text Orientation

Introduction: The text-orientation property of CSS is used to specify the orientation of the text characters in the line of content. This property applies only with the vertical writing-mode and not...

4 minutes read.

Css Box Model

Introduction The Box Model property of CSS is used for design and layout of an html page. In CSS, all the elements has a rectangular box around it, you have to...

5 minutes read.

CSS Word-spacing

Word-spacing The work-spacing property of CSS is applied to manage the space among the words. We can decrease or increase the space among the words by the use of this property. It...

3 minutes read.