Cannot automatically expand column width on IE and Edge with long text string

[cheton]

https://stackoverflow.com/questions/34352140/what-are-the-differences-between-flex-basis-and-width

Sample Code

<TableRow>
    <TableCell style={{ minWidth: 220 }}>
        <Dropdown
            style={{ width: '100%' }}
        >
            <Dropdown.Toggle btnStyle="flat" noCaret style={{ width: '100%', height: 36 }}>
                <FlexContainer fluid gutterWidth={0}>
                    <Row style={{ flexWrap: 'nowrap' }}>
                        <Col>
                            {'This is a very very very long text string.'}
                        </Col>
                        <Col width="auto">
                            <Caret />
                        </Col>
                    </Row>
                </FlexContainer>
            </Dropdown.Toggle>
            <Dropdown.Menu>
                {menuItems}
            </Dropdown.Menu>
        </Dropdown>
    </TableCell>
</TableRow>

[cheton]

Adding flex-basis: calc(100% - 16px) will make it work for IE and Edge browsers.

<Col style={{ flexBasis: 'calc(100% - 16px)' }}>
    {'This is a very very very long text string.'}
</Col>