Looking for help with aligning content to the middle and bottom on a full-page bootstrap layout? The first page has a background image in the first div, and a darker layer on top in the second div.
<div class="h-100 w-100">
<div class="h-100 w-100 text-center">
<div class="h-100 w-100 d-flex align-items-center">
<div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 col-xl-12">
<h1 style="color:#000;">something</h1>
<a href="">
www.something.com
</a>
<p class="tto_cl">
<span style="font-size: 1.8rem;">123</span>
</p>
<span style="text-transform:uppercase; color:#000; letter-spacing: 4px; font-family: Arial;">456</span><br>
</div>
</div>
</div>
Check out this Jsfiddle link for reference: https://jsfiddle.net/543r2dcs/2/
The content is currently aligned center, but you need it at the bottom instead.
If you're also struggling with understanding the new flexbox system's behavior, you're not alone!