Caption is rendered below table

[VTrngNghia]

Describe the bug
A clear and concise description of what the bug is. In addition, please search issues before you open a report to make sure there's no any duplicated report

To Reproduce
From the story book, the attribute caption= is supposed to render a caption on top of the table
<BootstrapTable keyField="id" data={ products } caption="Plain text header" columns={ columns } />

When I tried it, it renders the caption below the table.

Screenshots

codesandbox
I dont know how to use sandbox, here's my code in React

    const tbl_classes = isLoading
      ? <Spinner/>
      : <CardBody>
        <BootstrapTable
          striped hover condensed bordered={false}
          keyField="id" data={classes} columns={columns}
          caption="Caption in plain text"
          noDataIndication="Table is Empty"
        />
      </CardBody>;

[Ymbere]

Hi @VTrngNghia, your code is right the issue appears to be with the bootstrap4 CSS.
If it helps, for now, you can change your bootstrap CSS to the version 3.x.x

Here is a working example using bootstrap3

I will try to solve that issue as soon as I can.

[AllenFang]

Fixed in react-bootstrap-table-next@3.3.3, https://react-bootstrap-table.github.io/react-bootstrap-table2/blog/2019/12/07/version-bump.html