How to solve problem wordwrap in website

css

How to solve word problems that are too long on the website..

Step by step:

Make file "file.css" :

div {
   background: #ededed;
   border: solid 1px #ccc;
   padding: 10px;
   width: 180px;
   margin: 20px;
}
.break-word {
      word-wrap: break-word;
}

Example html code:

<div class="break-word">
   <h4>breakword</h4>
   <p>http://gspot-design.blogpost.comdhdfklhsdjs;ljflskhglkohdsklfhaklhfdklhaljhoierlksifjoijejrposfpjporejtpojpojflsjfpojptojdepojfpoejrp</p>
</div>

You can make other code like below:

Step by step:

Make file "file.css" :

.code {
        width:720px;
   overflow: auto;
}

Example html code:

<div class="code">
   <h4>breakword</h4>
   <p>http://gspot-design.blogpost.comdhdfklhsdjs;ljflskhglkohdsklfhaklhfdklhaljhoierlksifjoijejrposfpjporejtpojpojflsjfpojptojdepojfpoejrp</p>
</div>

Any question? Just comment..