Gap
Utilities to control the spacing between columns, rows, or both.
Adding Universal Row and Column Gaps
Use d-g{#} to universally change the row and column gap space.
<dt-stack direction="row" class="d-fl-col2 d-fw-wrap d-g16">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
</dt-stack>
Row Gap
Use d-rg{#} to change the row gap space.
<dt-stack class="d-rg16">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
</dt-stack>
Column Gap
Use d-cg{#} to change the column gap space.
<dt-stack direction="row" class="d-fl-col4 d-cg16">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
</dt-stack>
Independently Changing Row and Column Gaps
<dt-stack direction="row" class="d-rg32 d-cg8">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
</dt-stack>