justify-content-* / align-items-*
class
Flexbox alignment utilities for distributing and aligning items along main and cross axes.
Syntax
class="d-flex justify-content-between align-items-center"
Example
html
<div class="d-flex justify-content-start">Start</div>
<div class="d-flex justify-content-center">Center</div>
<div class="d-flex justify-content-end">End</div>
<div class="d-flex justify-content-between">Space between</div>
<div class="d-flex justify-content-evenly">Space evenly</div>
<!-- Vertically center content -->
<div class="d-flex align-items-center" style="height:100px">
<span>Vertically centered</span>
</div>