0

This is madness! I have tried adjusting parent to height 100%, wrapping them all in one container, adding classes such as align-self-center, my-auto, align-items-center, etc. But none of them seem to work. My simple layout is as follows: 

<div class="row">
  <div class="col-sm-6 mx-auto text-center">
    <p>hello</p>
  </div>
</div>

<div class="row">
  <div class="col-sm-6 mx-auto text-center">
    <p>hello 2</p>
  </div>
</div>

<div class="row">
  <div class="col-sm-6 mx-auto text-center">
    <p>hello 3</p>
  </div>
</div>

How can I get these to be vertically centered one after another? Thanks!

skyleguy
  • 979
  • 3
  • 19
  • 35
  • 1
    It works as explained in dup: https://www.codeply.com/go/UnTc7u92GT – Carol Skelly Jun 09 '18 at 20:27
  • That worked, I think my problem was that my body and html werent actually getting set to height: 100vh until i did it inline on the body tag. Weird. Thanks! – skyleguy Jun 09 '18 at 20:36

0 Answers0