The .flex-grow-* utilities can be used to toggle a flex item’s ability to grow to fill available space. In the example below, the .flex-grow-1 elements use all the available space they can, while allowing the remaining two flex items their necessary space.

Detailed documentation and more examples you can find in our Bootstrap Flexbox Docs


Example

<div class="flex-grow-1">Flex item</div>
Flex item
Flex item
Third flex item