reactjshtml-tablereact-bootstrapreact-bootstrap-table

Why isn't react-bootstrap table not working

i wanted to create a table using react-bootstrap .so installed react-bootstrap by npm install react-bootstrap boostrap then i imported the Table from react-bootstrap and rendered the table but it is not styled?

why isn't this working ?

import { Table } from 'react-bootstrap'

<Table striped bordered hover>
  <thead>
    <tr>
      <th>#</th>
      <th>Name</th>
      <th>Chest No.</th>
    </tr>        
  </thead>
  <tbody>
    <tr>
      <td>1</td>
      <td>No one</td>
      <td>101</td>
    </tr>
  </tbody>
</Table>

this table in not styled (no hover, no strip ........)

Solution

  • I think you forgot to import bootstrap. Add the following line inside your index.js file

    import "bootstrap/dist/css/bootstrap.css";

    Here is a working example.