Mixed: Mobile And Desktop. The Bootstrap grid system has four classes: xs (phones), sm (tablets), md (desktops), and lg (larger desktops). The classes can be combined to create more dynamic and flexible layouts.
xxxxxxxxxx
<Row>
<Col xs={12} sm={3} md={2} lg={1} />
<Col xs={6} sm={6} md={8} lg={10} />
<Col xs={6} sm={3} md={2} lg={1} />
</Row>
https://stackoverflow.com/questions/43445592/what-is-the-meaning-of-xs-md-lg-in-css-flexbox-system
https://roylee0704.github.io/react-flexbox-grid/
https://devdocs.io/bootstrap~5/layout/breakpoints/index#core-concepts