In Bootstrap, how do I make text stay within the parent div?

I'm struggling to get the text associated with a link and a paragraph to stay within their parent div.

I set the outer boundary as col-sm-8 but the text links are overflowing, not sure what I'm doing wrong here but the code I'm currently using is directly below. FWIW, I've tried setting box-sizing as content-box on both the link and the paragraph with no luck:

<div class="col-sm-8"><!-- Begin Box -->  <div class="box">  <div class="box-thumb" onclick="window.open('/generationetfs')" style="cursor:pointer; background-image:url('/horizons/media/cssImages/ca/homepagetools/podcast.jpg');">&nbsp;</div>  </div>    <h2 class="box-title"><a class="box-link" href="/generationetfs" target="_blank">Generation ETFs Podcastasasasasasasasaaaaaaaaaaaaaaaaaaaaaaaaaaaaas</a></h2>    <p>Welcome to Generation ETFs, a podcast series dedicated to the <strong>next generation of investingasaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</strong></p>  </div>  <!-- End Box -->  

The page in question is this, where you see the text overflowing the col-sm-8 boundary: http://kenticocms.fourthdimensioninc.com/homey

What am I missing here?

https://stackoverflow.com/questions/66773291/in-bootstrap-how-do-i-make-text-stay-within-the-parent-div March 24, 2021 at 08:53AM