What this Bootstrap Utility API class does
Sets the CSS property "align-items" of an element. The CSS property "align-items" is used to align the items within a flexbox container along the cross-axis, which is perpendicular to the main axis.
By using the "align-items" property, a web developer can control the vertical alignment of the items within a flexbox container. This is useful for creating layouts that are responsive and adapt to different screen sizes and devices.
Example usage & available classes
<div class="d-flex align-items-start">...</div>
<div class="d-flex align-items-end">...</div>
<div class="d-flex align-items-center">...</div>
<div class="d-flex align-items-baseline">...</div>
<div class="d-flex align-items-stretch">...</div>
Example override
In the example override below, we are removing the responsive option from the utility, which means it would not be available per breakpoint.
"align-items": map-merge(
map-get($utilities, "align-items"),
(
responsive: false
)
)