grid system in reactstrap

1import React from 'react';
2import { Container, Row, Col } from 'reactstrap';
3
4const Example = (props) => {
5  return (
6    <Container>
7      <Row xs="2">
8        <Col>Column</Col>
9        <Col>Column</Col>
10        <Col>Column</Col>
11        <Col>Column</Col>
12      </Row>
13      <Row xs="3">
14        <Col>Column</Col>
15        <Col>Column</Col>
16        <Col>Column</Col>
17        <Col>Column</Col>
18      </Row>
19      <Row xs="4">
20        <Col>Column</Col>
21        <Col>Column</Col>
22        <Col>Column</Col>
23        <Col>Column</Col>
24      </Row>
25      <Row xs="4">
26        <Col>Column</Col>
27        <Col>Column</Col>
28        <Col xs="6">Column</Col>
29        <Col>Column</Col>
30      </Row>
31      <Row xs="1" sm="2" md="4">
32        <Col>Column</Col>
33        <Col>Column</Col>
34        <Col>Column</Col>
35        <Col>Column</Col>
36      </Row>
37    </Container>
38  );
39}
40
41export default Example;
42