diff --git a/site/docs/4.1/utilities/flex.md b/site/docs/4.1/utilities/flex.md index a9a388b18bd362f2422cbe0a7b3a5a3ed54fd392..41e03c53f3c3a838dd690960aac4e18ca32f70d5 100644 --- a/site/docs/4.1/utilities/flex.md +++ b/site/docs/4.1/utilities/flex.md @@ -219,11 +219,11 @@ Responsive variations also exist for `align-self`. ## Fill -Use the `.flex-fill` class on a series of sibling elements to force them into equal widths while taking up all available horizontal space. [Especially useful for equal-width, or justified, navigation]({{ site.baseurl }}/docs/{{ site.docs_version }}/components/navs/#working-with-flex-utilities). +Use the `.flex-fill` class on a series of sibling elements to force them into widths equal to their content (or equal widths if their content does not surpass their border-boxes) while taking up all available horizontal space. {% capture example %} <div class="d-flex bd-highlight"> - <div class="p-2 flex-fill bd-highlight">Flex item</div> + <div class="p-2 flex-fill bd-highlight">Flex item with a lot of content</div> <div class="p-2 flex-fill bd-highlight">Flex item</div> <div class="p-2 flex-fill bd-highlight">Flex item</div> </div>