Как я могу сделать таблицу адаптивной в Semantic-UI-React?

Question

Прямо сейчас у меня длинный и широкий стол. Он занимает все 16 точек в сетке и выглядит хорошо, но когда я перебрасываю некоторые данные до Table.cell. Это может сломать ширину стола. Как это:

Может ли какой-нибудь орган помочь мне решить эту проблему?

 <Table>
  <Table.Body>
    <Table.Row>
      <Responsive as={Table.Cell} minWidth={Responsive.onlyMobile.minWidth}>
      Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
      </Responsive>
      <Responsive as={Table.Cell} minWidth={Responsive.onlyMobile.minWidth}>Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd</Responsive>
      <Responsive as={Table.Cell} minWidth={Responsive.onlyMobile.minWidth}>
        <Responsive
          as={Table.Cell}
          minWidth={Responsive.onlyMobile.minWidth}
        >
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
          Bazfasdfssafsdsdddddddddddddddddddddddddddddddddddddd
        </Responsive>
      </Responsive>
    </Table.Row>
  </Table.Body>
</Table>

Answer 1

Вы пытались добавить style={{ overflow: auto }} к <Table.body />