word-wrap

The word-wrap property controls the wrapping of long words when they do not fit within the parent block.

An example of how to set character wrapping using word-wrap.

        
          
          p {  border: 1px solid #fff;  width: 100px;  word-wrap: break-word;}
          p {
  border: 1px solid #fff;
  width: 100px;
  word-wrap: break-word;
}

        
        
          
            
            Copy
            Copied
            Failed to copy
          
        
      

Possible values:

• normal — the default value. With this value, text will wrap at spaces, special characters, and the tag <br>.
• break-word — the word wraps at any letter upon reaching the edge of the parent area.

💡 By default, a long word without spaces between them will extend beyond the width of the container if it is not broken.