title: Background color not filling full entire row height when using my-auto
body: <p>I have a boot-strap row where a i want the first column to have blue background and text to be centered vertically and horizontaly.</p>
  <p>If I don't center text horizontally it works
  HTML</p>
  <pre class="lang-html prettyprint-override"><code> &lt;div class = &quot;shadow p-3 mb-5 bg-white rounded&quot; style=&quot;padding: 0 !important;&quot;&gt;
      &lt;div class=&quot;container&quot;&gt;
              &lt;div class=&quot;row main-row&quot;&gt;
                  &lt;div class=&quot;col-2 booking-flight-info-dir text-center   &quot; style=&quot;&quot;&gt;
                          &lt;img  src=&quot;&lt;?= plugin_dir_url( __DIR__ ).'/img/out_flight_icon.png'?&gt;&quot; alt=&quot;out_flight_icon.png&quot; style=&quot;padding-left:10px &quot; &gt;
                          &lt;span &gt;תיסת הלוך&lt;/span&gt;
                  &lt;/div&gt;
                  &lt;div class=&quot;col-2 booking-flight-info-flightnum text-center  my-auto&quot; style=&quot;&quot;&gt;
                  &lt;span&gt;טיסה מספר:&lt;/span&gt;&lt;BR&gt;
                  &lt;span style=&quot;font-size: x-large;font-weight: bold;text-align: center&quot;&gt;&lt;?= $rowData-&gt;outTrip-&gt;flightNmr?&gt;&lt;/span&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  <p><a href="https://i.stack.imgur.com/LCXjv.png" rel="nofollow noreferrer">without my-auto</a></p>
  <p>However once I add my-auto to center tex horizontally, the background color is don't fill entire row-height, only the area of the text.</p>
  <pre><code>&lt;div class = &quot;shadow p-3 mb-5 bg-white rounded&quot; style=&quot;padding: 0 !important;&quot;&gt;
  &lt;div class=&quot;container&quot;&gt;
  
          &lt;div class=&quot;row main-row&quot;&gt;
  
              &lt;div class=&quot;col-2 booking-flight-info-dir text-center my-auto &quot; style=&quot;&quot;&gt;
                      &lt;img  src=&quot;&lt;?= plugin_dir_url( __DIR__ ).'/img/out_flight_icon.png'?&gt;&quot; alt=&quot;out_flight_icon.png&quot; style=&quot;padding-left:10px &quot; &gt;
                      &lt;span &gt;תיסת הלוך&lt;/span&gt;
              &lt;/div&gt;
  
              &lt;div class=&quot;col-2 booking-flight-info-flightnum text-center  my-auto&quot; style=&quot;&quot;&gt;
              &lt;span&gt;טיסה מספר:&lt;/span&gt;&lt;BR&gt;
              &lt;span style=&quot;font-size: x-large;font-weight: bold;text-align: center&quot;&gt;&lt;?= $rowData-&gt;outTrip-&gt;flightNmr?&gt;&lt;/span&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  
      &lt;/div&gt;
  
  
  &lt;/div&gt;
  </code></pre>
  <p><a href="https://i.stack.imgur.com/STQJ6.png" rel="nofollow noreferrer">with my-auto</a></p>