Gleiche Höhe Spalten + vertikal und horizontal zentrierten Inhalt in Bootstrap 4

Question

Ich habe Mühe, zwei Spalten gleicher Höhe zu machen, aber immer noch horizontal und vertikal den Inhalt innerhalb der ersten Spalte ausrichten.

Dieser fasst zusammen, was ich versuche zu tun: hier

<div class="row"> 
<div class="col-lg-4 align-self-center"> 
    <p>Text here should be centered both horizontally and vertically. But this col should have the same height as the col containing the image.</p> 
</div> 
<div class="col-lg-8"> 
    <img class="img-fluid" src="http://via.placeholder.com/1920x1080"> 
</div> 

Sie können auch einen Blick: https://www.codeply.com/go/bGhFGn8nqq

Ich habe mehrere Dinge ausprobiert, aber ich kann‘ Ich scheine es richtig zu machen.

Vielen Dank im Voraus.

Answer 1

Zentrum der Inhalt p innerhalb der Säule ...

https://www.codeply.com/go/lyPAOH1Tq2

<div class="row"> 
    <div class="col-lg-4 d-flex"> 
     <p class="my-auto">Text here should be centered both horizontally and vertically. But this col should have the same height as the col containing the image.</p> 
    </div> 
    <div class="col-lg-8"> 
     <img class="img-fluid" src="http://via.placeholder.com/1920x1080"> 
    </div> 
</div>