What this Bootstrap Utility API class does
Sets the CSS flex-grow property of an element. The CSS property flex-grow is used to control the ability of a flex item to grow and take up available space within a flex container.
The flex-grow property specifies the proportion of the available space that a flex item should take up along the main axis of the flex container. It is a unitless value that represents the share of the remaining space that should be allocated to the item after all non-flexible items have been laid out.
Example usage & available classes
<div class="d-flex bd-highlight"> <div class="p-2 flex-grow-1 bd-highlight">Flex item</div> <div class="p-2 flex-grow-0 bd-highlight">Flex item</div> <div class="p-2 bd-highlight">Third flex item</div> </div>
In the example override below, we are removing the responsive option from the utility, which means it would not be available per breakpoint.
"flex-grow": map-merge( map-get($utilities, "flex-grow"), ( responsive: false ) )