Forcing a long line of text (without spaces) to line break according to parent containers static width using CSS [duplicate]

Modern (CSS3) answer, that now works in all browsers:

.wrap {
  overflow-wrap: break-word;
}

Note that you may need to add overflow:hidden and/or width:100% to a parent/ancestor element.


Old answer:

.wrap { 
   white-space: pre-wrap;      /* CSS3 */   
   white-space: -moz-pre-wrap; /* Firefox */    
   white-space: -pre-wrap;     /* Opera <7 */   
   white-space: -o-pre-wrap;   /* Opera 7 */    
   word-wrap: break-word;      /* IE */
}

Leave a Comment