CSS | word-spacing Property

It is a CSS property to increases or decreases the white space between words. This property can have only two values, they are normal and length.
Syntax:

word-spacing: normal|length|initial|inherit;

Property values:

  • Normal: It defines normal space between words which is 0.25em. This is default value.
    Example:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <!DOCTYPE html>
    <html>
    <head>
        <title>
          CSS | word-spacing Property
        </title>
    </head>
    <body>
        <h1>The word-spacing Property</h1>
      
        <h2>word-spacing: normal:</h2>
        <p style="  word-spacing: normal;
                    color:green; 
                    font-weight:bold;
                    font-size:25px;">
            This is some text. This is some text.
        </p>
    </body>
      
    </html>

    chevron_right

    
    

    Output:

  • Length: It defines an additional space between words (in px, pt, cm, em, etc). Negative values are also allowed.
    Example:

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <!DOCTYPE html>
    <html>
    <head>
        <title>
          CSS | word-spacing Property
        </title>
    </head>
    <body>
        <h1>The word-spacing Property</h1>
      
        <h2>word-spacing: length is 20px</h2>
        <p style="  word-spacing:20px;
                    color:green; 
                    font-weight:bold;
                    font-size:25px;">
            GeeksforGeeks - A Computer Science Portal For Geeks!
        </p>
    </body>
      
    </html>

    chevron_right

    
    

    Output:

    Example: Length to Negative Value

    filter_none

    edit
    close

    play_arrow

    link
    brightness_4
    code

    <!DOCTYPE html>
    <html>
    <head>
        <title>
          CSS | word-spacing Property
        </title>
    </head>
    <body>
        <h1>The word-spacing Property</h1>
      
        <h2>word-spacing: length is -20px</h2>
        <p style="word-spacing:-20px;
                  color:green;
                  font-weight:bold;
                  font-size:25px;">
            GeeksforGeeks - A Computer Science Portal For Geeks!
        </p>
    </body>
      
    </html>

    chevron_right

    
    

    Output:

  • Supported browsers: The browsers supported by word-spacing Property are listed below:

    • Google Chrome 1.0
    • Internet Explorer 6.0
    • Firefox 1.0
    • Opera 3.5
    • Safari 1.0


    My Personal Notes arrow_drop_up

    Check out this Author's contributed articles.

    If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.

    Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.