Question 74436 in Reactjs Question posted in
The new location for the React Documentation can be found here.

Why isn't react-bootstrap table not working – Reactjs

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 ……..)

Tags:

2

Answers


  1. 0

    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.

    Login or Signup to reply.
  2. 0

    Have you imported the bootstrap CSS file?
    If not, you could import it in your index.js file.

    import 'bootstrap/dist/css/bootstrap.min.css';

    or

    Download bootstrap.min.css.
    Then import it

    import 'path-to-bootstrap/bootstrap.min.css';
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search