Why is it not centered in Bootstrap 4?

Question

Bootstrap

Why is it not centered in Bootstrap 4?

<div class="container mb-5">
    <div class="row justify-content-center">
      <div class="col">
        <img src="img/otis.png" class="img-fluid" alt="otis" width="200px" style="margin-top: 250px;"><br>
        <img src="img/schindler.png" class="img-fluid" alt="schindler" width="200px" style="margin-top: 300px;">
      </div>
      <div class="col">
        <h1 id="Brands">Brands we work with</h1>
      </div>
      <div class="col">
        <img src="img/kone.png" class="img-fluid" alt="otis" width="200px" style="margin-top: 250px;"><br>
        <img src="img/Thyssenkrupp.png" class="img-fluid" alt="schindler" width="200px" style="margin-top: 300px;">
      </div>
    </div>
  </div>

#Brands{
  font-size: 50px;
  font-family: Gilroy Black;
  writing-mode: vertical-lr;
  transform: scale(-1);
  margin-top: 280px;
}

Answer 1

The justify-content-center class for a row will not give anything, because it is applied only directly to the columns, and their width is already rigidly defined by the bootstrap.
If you need text to align horizontally, try adding .d-flex.justify-content-center to the desired column:

<div class="col d-flex justify-content-center">
  <h1 id="Brands">Brands we work with</h1>
</div>