React bootstrap components are not working properly

1
votes

I am using react-bootstrap front-end library in my react project. React-bootstrap components are not working properly.

I also checked the official react-bootstrap website and it also misses the styling of the website.

What could be the reason for that styling issue?

I already tried to add import 'bootstrap/dist/css/bootstrap.min.css'; in the index.js file but that is affecting my other UI components which I do not want to mess up.

1
stylingreact-bootstrap
Load your bootstrap css file first and then load your custom css files. Also try to use !important for your custom css style. – ravibagul91

1 Answers

1
votes

You have to add the import for:

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

in your index.js or whatever. If the import will mess up your design on your page, you have to adjust the used classes etc. It's required to load the Bootstrap styles in order to use react-bootstrap library.