mx-auto (auto x-axis margins) will center inside display:flex elements that have a defined width, (%, vw, px, etc..). Flexbox is used by default on grid columns, so there are also various centering methods.
<Card style={{ width: '18rem' }} className='mx-auto'>
<Card.Title><img className='mx-auto' src="https://placehold.co/25x25" /></Card.Title>
<Container className="text-center">
<Row><h2>Happy customers</h2></Row>
</Container>
<Alert variant="danger" className="text-center">
Error: There is no camera!
</Alert>
<div>
s and more), use our flex box utilities.<Container fluid={true}>
<Row>
<Col className='d-flex align-items-center'><HeroBenefits accId={data.accId}/></Col>
<Col><HeroExample domain={data.domain}/></Col>
</Row>
</Container>