Issue with <p></p> in Bootstrap 4, HTML, and CSS

Question

I try to have multiple p tags in a division, but the paragraphs aren't separating and are just bunching together. The applicable code is as follows:

<div class="row">
    <div class="col-md-12 d-flex justify-content-center padding-top">
        <p>IMPORTANT LEGAL DISCLAIMER FOR TESTIMONIALS, RISK AND TYPICAL RESULTS, AS WELL AS REFUNDS</p>
        <p>Test</p>
    </div>
</div>

and the link to codeply is https://www.codeply.com/go/cJ37oz9g4Q. If you go to codeply, then you'll see that "Test" appears immediately after the word "REFUNDS". I have tried modifying the code, looking for known issues, etc.

How can I fix this?

Answer 1

You need to remove d-flex class from this code:

<div class="col-md-12 justify-content-center padding-top">
  <p>IMPORTANT LEGAL DISCLAIMER FOR TESTIMONIALS, RISK AND TYPICAL RESULTS, AS WELL AS REFUNDS</p>
  <p>Test</p>
</div>