FlexItem
Min Width
Truncated content inside FlexItem will not truncate as expected,
because flex items have a
default minWidth of auto.
You can enable truncation by setting minWidth to 0 on the wrapping FlexItem
(why does this work?).
Super long example of text that is specifically formed to force truncation, when minWidth is set to 0, even when the viewport is rather wide
<Flex> <FlexItem><Button>Short Text</Button></FlexItem> <FlexItem><Button>Short Text</Button></FlexItem> <FlexItem minWidth={0}> <Select placeholder="Super long example of text that is specifically formed to force truncation, when minWidth is set to 0, even when the viewport is rather wide" data={data} /> </FlexItem> </Flex>