react-bootstrap 반응형

쇼핑몰 만들기에서 저는 react-bootstrap으로 Row 3개를 만들려고 했는데요, 
왜 반응형이 안될까요?

import Container from 'react-bootstrap/Container';
import Row from 'react-bootstrap/Row';
import Col from 'react-bootstrap/Col';

function ResponsiveAutoExample() {
  return (
    <Container>
      <Row>
        <Col sm={8}>sm=8</Col>
        <Col sm={4}>sm=4</Col>
      </Row>
      <Row>
        <Col sm>sm=true</Col>
        <Col sm>sm=true</Col>
        <Col sm>sm=true</Col>
      </Row>
    </Container>
  );
}

export default ResponsiveAutoExample;

여기서 
<Col sm></Col>
<Col sm></Col>
<Col sm></Col>

+ 요소도 다 import했습니다

이렇게 사용했는데, 화면이 넓을때는 한 줄에 3개로 잘 나오지만 화면 너비를 줄여도 크기가 줄어들 뿐 여전히 한 줄에 3개가 나옵니다.

제가  혹시 요소를 잘못찾은거라면 react-bootstrap 홈페이지에서 요소 이름을 알려주시면 감사하겠습니다.