Error with Html/Bootstrap text alignment

Question

I’m having a problem with a website I can’t fix. I’m trying to make an information card without using a Bootstrap card because I want the image to be on the left side so I decided to do something similar but only with Rows and columns and it was like this:

However, I’m not getting the example name under Heading Name.

 <div class="row padInternalRow">
           <div class="col-5 border">
              <img class="img-fluid float-left" src="imagens\user.png" height="175" alt="Card image cap">
              </div>
           <div class="col-7 w-50">
              <div class="row border h-50">
                   <h5 class="text-left">Nome</h5>
                   <p class="text-left"><br />Nome exemplo</p>
              </div>
              <div class="row border h-50">
                   <p class="text-center">Funcao</p>
                   <p class="text-center"><br />Funcao exemplo</p>
              </div>
        </div>
   </div>

Answer 1

Guy has some details in his code, first the BR within the P. After you put a height on container, but it does not need as you will see. In short I only removed things the more you put in the elements and includes the class flex-column in Row for the elements to be one below the other.

<link rel="stylesheet" type="text/css" media="screen" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" />

<div class="row padInternalRow">
    <div class="col-5 border">
        <img class="img-fluid float-left" src="imagens\user.png" height="175" alt="Card image cap">
    </div>
    <div class="col-7 w-50">
        <div class="row border  flex-column">
            <h5 class="text-left">Nome</h5>
            <p class="text-left">Nome exemplo</p>
        </div>
        <div class="row border flex-column">
            <p class="text-left">Funcao</p>
            <p class="text-left">Funcao exemplo</p>
        </div>
    </div>
</div>