Place Items
Utilities for controlling how grid items are aligned along their block and inline axis directions.
Stretch
Use d-pli-stretch{-n} to stretch grid items along their block and inline axis.
<div class="d-d-grid d-g-cols2 d-pli-stretch">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
</div>
Start
Use d-pli-start{-n} to align grid items along the start of their block and/or inline axis.
<div class="d-d-grid d-g-cols2 d-pli-start">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
</div>
End
Use d-pli-end{-n} to align grid items along the end of their block and/or inline axis.
<div class="d-d-grid d-g-cols2 d-pli-end">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
</div>
Center
Use d-pli-center{-n} to align grid items along the center of their block and/or inline axis.
<div class="d-d-grid d-g-cols2 d-pli-center">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
</div>