Problem with small width and material-ui

[TheBlusky]

When using a "small" Card with material-ui, the behaviour of the text is not the same within a Row or within a div.

Using the following code :

        <Row style={{"margin": "10px"}}>
          <Col lg={2} md={2} sm={2} xs={2}>
            <Card>
              <CardText>
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam maximus rhoncus mauris. Quisque nibh mauris,
                vestibulum a sodales a, tempor sit amet dui. Nullam non metus in enim eleifend feugiat. Sed interdum nisl
                felis, et viverra ex facilisis vitae.
              </CardText>
            </Card>
          </Col>
        </Row>

        <br />

        <div style={{"margin": "20px"}}>
          <Card style={{"width":"200"}}>
            <CardText>
              Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam maximus rhoncus mauris. Quisque nibh mauris,
              vestibulum a sodales a, tempor sit amet dui. Nullam non metus in enim eleifend feugiat. Sed interdum nisl
              felis, et viverra ex facilisis vitae.
            </CardText>
          </Card>
        </div>

I got the following screen:

Is there any way to make the text automatically breaking line in a Row ?

Thanks

Edit: same issue using <Grid fluid> or <Grid>

[jacargentina]

@TheBlusky could you try with https://jacargentina.github.io/react-flexbox-grid/ ? Post questions/issues there if needed.