Hello friends, In this post, I am providing a css class that helps you to break line of long sentences written in div, span, table or any type of container element whether it's used in html page, visualforce page, lighting component or lightning web components.

CSS:
 .wrapword{
    white-space: -moz-pre-wrap !important; /*Mozilla, since 1999*/
    white-space: -webkit-pre-wrap; /*Chrome and Safari */ 
    white-space: -pre-wrap; /*Opera 4-6*/
    white-space: -o-pre-wrap; /*Opera 7*/
    white-space: pre-wrap; /* css-3 */
    word-wrap: break-word; /*Internet Explorer 5.5+ */
    word-break: break-all;
    white-space: normal;
 }
Example: 
 <html>
 <head>
 <style>
 .wrapword{
    white-space: -moz-pre-wrap !important; /*Mozilla, since 1999*/
    white-space: -webkit-pre-wrap; /*Chrome and Safari */ 
    white-space: -pre-wrap; /*Opera 4-6*/
    white-space: -o-pre-wrap; /*Opera 7*/
    white-space: pre-wrap; /* css-3 */
    word-wrap: break-word; /*Internet Explorer 5.5+ */
    word-break: break-all;
    white-space: normal;
 }
 </style>
 <body>
 <center>
        <br/>
        <h3>
            Line Break CSS for HTML, Visualforce Page and Lightning Component.
        </h3><br/><br/>
        <div clas="wrapword" style="width:300px">
            Salesforce Scool=Learn Salesforce, Visualforce, Apex, Lightning Component, JavaScript, Jquery, CSS
        </div>
    </center>
 </body>
 </head>
 </html>
Output:

See also:
Conclusion:
Hope you like this post, for any feedback or suggestions please feel free to comment. I would appreciate your feedback and suggestions.
Thank you.