how to make text automatically go to the next line in bootstrap column
<p>I have this row and column inside container</p>

<pre><code>&lt;div class="container"&gt;
    &lt;div class="row"&gt;
        &lt;div class="col-md-4" &gt;
            &lt;h1&gt;About&lt;/h1&gt;
&lt;p&gt;asdasdsadasdasdassdasdasdadassssssssssssssssssssssssssssssssssssssssssss&lt;/p&gt;
        &lt;/div&gt;  
    &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>How can i make it go to the next line when it reach the end of the column?
<a href="https://i.stack.imgur.com/XZbRc.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/XZbRc.png" alt="Layout"></a></p>