CODEWITHSUNDEEP
reactjsreact-bootstrap
Shahroozevsky
Shahroozevsky

Reputation: 343

Load Reactjs Bootstrap styling

I'm very new to reactjs. There is a third-party library called react-bootstrap that I want to use in my project. I installed it via yarn and when I want to use it's components, nothing happens! For example:

import { Button } from 'react-bootstrap'
<Button variant="success">Sign In</Button>

has no effect on a button. In elements I can see that the class assigned:

<button type="button" class="btn btn-success">Sign In</button>

but there isn't any effect in button!! What should I do? If you need any clarification, simply ask for it. Thank you!

Upvotes: 0

Views: 33

Answers (1)

ravibagul91
ravibagul91

Reputation: 20765

You need to add bootstrap.css, either by adding link in index.html

<link
      rel="stylesheet"
      href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
      integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T"
      crossorigin="anonymous"
    />

or by importing in index.js file after installing bootstrap using yarn / npm.

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

Demo

Upvotes: 1

Related Questions