Skip to main content

Justify Items

Version: 0.9.0
Edit

Defines the default justify-self for all flex/grid items. (MDN web docs)

Basic

Author: Mary Ditchen
Since: 0.9.0
Source: /source/patterns/utilities/justify-items.scss#L11

Justify Items Center
Justify Items Start
Justify Items End
Justify Items Stretch
<!-- justify items center -->
<div class="u-justify-items-center">Justify Items Center</div>
<!-- justify items start -->
<div class="u-justify-items-start">Justify Items Start</div>
<!-- justify items end -->
<div class="u-justify-items-end">Justify Items End</div>
<!-- justify items stretch -->
<div class="u-justify-items-stretch">Justify Items Stretch</div>

Baseline

Author: Mary Ditchen
Since: 0.9.0
Source: /source/patterns/utilities/justify-items.scss#L44

Justify Items Baseline
<!-- justify items baseline -->
<div class="u-justify-items-baseline">Justify Items Baseline</div>

Globals

Author: Mary Ditchen
Since: 0.9.0
Source: /source/patterns/utilities/justify-items.scss#L56

Justify Items Inherit
Justify Items Initial
Justify Items Unset
<!-- justify items inherit -->
<div class="u-justify-items-inherit">Justify Items Inherit</div>
<!-- justify items initial -->
<div class="u-justify-items-initial">Justify Items Initial</div>
<!-- justify items unset -->
<div class="u-justify-items-unset">Justify Items Unset</div>