white-space property in CSS

• In CSS (Cascading Style Sheets), the "white-space" property is used to control how white space characters, such as spaces, tabs, and line breaks, are handled within an element's content. It determines how the browser should handle the spacing and wrapping of text within the specified element.

• The "white-space" property accepts several different values, which control different aspects of white space handling. Here are the most commonly used values:

• normal (default): This value collapses consecutive white spaces into a single space, and wraps the text when necessary to fit within the container's width. Line breaks are treated as a single space as well.

• nowrap: This value prevents the text from wrapping to the next line. The text will extend beyond the container's width if it exceeds the available space.

• pre: This value preserves the original formatting of the text, including all white spaces and line breaks. It displays the text exactly as it is written in the HTML code.

• pre-wrap: This value preserves the original formatting of the text, including white spaces and line breaks. However, it also wraps the text when necessary to fit within the container's width.

• pre-line: This value collapses consecutive white spaces into a single space, but preserves line breaks. It wraps the text when necessary to fit within the container's width.

• These values can be applied to block-level elements, such as paragraphs (`<p>`) or divisions (`<div>`), as well as inline-level elements, such as spans (`<span>`) or anchors (`<a>`).

• Additionally, the "white-space" property can be combined with other CSS properties, such as "overflow" and "text-overflow," to control how the content behaves when it overflows the container's width or height.

• Here's an example that demonstrates the use of the "white-space" property:

    p {

        white-space: pre-wrap;

    }

• In the above example, the content of `<p>` elements will wrap when necessary to fit within the container, while preserving the original line breaks and white spaces.

• Overall, the "white-space" property provides flexibility in controlling how white spaces and line breaks are handled, allowing developers to adjust the appearance and layout of text within HTML elements.