Javascript 脉轮UI表脉轮UI组件是否可能有溢出x来响应？

我有一个Chakra UI表，当整个表不再适合屏幕时，我希望有一个溢出x，似乎不知道如何从左向右滚动

<Table my={{ base: '1rem' }}>
          <Thead>
            <Tr>
              <Th>Question</Th>
              <Th>Answer</Th>
              <Th>Action</Th>
            </Tr>
          </Thead>
          <Tbody>
            {faqs.map(faq => (
              <Tr key={faq._id}>
                <Td>{faq.question}</Td>
                <Td>{faq.answer}</Td>
                <Td width="15%">
                  <ButtonGroup spacing="3">
                    <Button
                      colorScheme="blue"
                      onClick={() => modalOnOpenHandler(faq._id)}
                    >
                      <EditIcon />
                    </Button>
                    <Button
                      colorScheme="red"
                      onClick={() => idDialogHandler(faq._id)}
                    >
                      <DeleteIcon />
                    </Button>
                  </ButtonGroup>
                </Td>
              </Tr>

问题:
答复
行动
{faq.map（faq=>(
{faq.问题}
{常见问题解答}
modalOnOpenHandler（常见问题）}
>
idDialogHandler（常见问题解答）}
>

问题是我有一个flex父级用于侧边栏菜单和内容组件，这就是为什么滚动无法检测到它需要滚动的原因