5.spacing

• mb margin bottom

<h1 class="mb-0 bg-success">Margin Bottom 0</h1>
<h1 class="mb-1 bg-success">Margin Bottom 1</h1>
<h1 class="mb-2 bg-success">Margin Bottom 2</h1>
<h1 class="mb-3 bg-success">Margin Bottom 3</h1>
<h1 class="mb-4 bg-success">Margin Bottom 4</h1>
<h1 class="mb-5 bg-success">Margin Bottom 5</h1>

• mt margin top

<h1 class="mt-0 bg-success">Margin Top 0</h1>
<h1 class="mt-1 bg-success">Margin Top 1</h1>
<h1 class="mt-2 bg-success">Margin Top 2</h1>
<h1 class="mt-3 bg-success">Margin Top 3</h1>
<h1 class="mt-4 bg-success">Margin Top 4</h1>
<h1 class="mt-5 bg-success">Margin Top 5</h1>

• ml & mr

<p>
    <span class="mr-5 bg-success">Margin Right 5</span> dolor sit amet,
    <span class="ml-3 bg-success">Margin Left 3 </span> elit. Voluptatum, optio.
</p>

• mx margin left right

<p>Lorem ipsum
    <span class="mx-5 bg-success">Margin Left & Right 5</span>, consectetur elit. Voluptatum, optio.
</p>

• my margin top bottom

<p>Lorem ipsum dolor sit amet, consectetur elit. Voluptatum, optio.</p>
<p class="my-5 bg-success">Margin Top & Bottom 5</p>
<p>Lorem ipsum dolor sit amet, consectetur elit. Voluptatum, optio.</p>

• blank - all sides

<p>Lorem ipsum dolor sit amet, consectetur elit. Voluptatum, optio.</p>
<p class="m-5 bg-success">Margin All Sides 5</p>
<p>Lorem ipsum dolor sit amet, consectetur elit. Voluptatum, optio.</p>

• pb padding bottom

<h1 class="pb-0 bg-warning">Padding Bottom 0</h1>
<h1 class="pb-1 bg-warning">Padding Bottom 1</h1>
<h1 class="pb-2 bg-warning">Padding Bottom 2</h1>
<h1 class="pb-3 bg-warning">Padding Bottom 3</h1>
<h1 class="pb-4 bg-warning">Padding Bottom 4</h1>
<h1 class="pb-5 bg-warning">Padding Bottom 5</h1>

• pt padding top

<h1 class="pt-0 bg-warning">Padding Top 0</h1>
<h1 class="pt-1 bg-warning">Padding Top 1</h1>
<h1 class="pt-2 bg-warning">Padding Top 2</h1>
<h1 class="pt-3 bg-warning">Padding Top 3</h1>
<h1 class="pt-4 bg-warning">Padding Top 4</h1>
<h1 class="pt-5 bg-warning">Padding Top 5</h1>

• pl & pr

<p>
    <span class="pr-5 bg-warning">Padding Right 5</span> dolor sit amet,
    <span class="pl-3 bg-warning">Padding Left 3 </span> elit. Voluptatum, optio.
</p>

• px padding left right

<p>Lorem ipsum
    <span class="px-5 bg-warning">Padding Left & Right 5</span>, consectetur elit. Voluptatum, optio.
</p>

• py padding top bottom

<p>Lorem ipsum
    <span class="px-5 bg-warning">Padding Left & Right 5</span>, consectetur elit. Voluptatum, optio.
</p>

• all sides

<p>Lorem ipsum
    <span class="px-5 bg-warning">Padding Left & Right 5</span>, consectetur elit. Voluptatum, optio.
</p>

• horizontal centering

<div class="mx-auto bg-info" style="width: 200px;">
    Horizontal Centering
</div>