Overriding bootstrap styles
See original GitHub issueHi guys,
This is probably a very stupid question, but …
I’ve imported bootstrap into my create-react-app project as per the documentation (very nice).
However when I look at the generated markup, all the <style> tags for my components e.g. Header.css
come before the bootstrap css, which means I can’t (easily) override bootstraps default styling.
Is there a way to ensure bootstrap gets put before other css files?
Issue Analytics
- State:
- Created 7 years ago
- Comments:8 (6 by maintainers)
Top Results From Across the Web
How to Edit, Customize, and Override Bootstrap CSS to Suit ...
You can override the default styles of Bootstrap elements using two possible methods. The first way — using CSS overrides— applies to sites ......
Read more >How can I override Bootstrap CSS styles? - Stack Overflow
Yes, overrides should be put in a separate styles.css (or custom.css ) file so that the bootstrap.css remains unmodified. This makes it easier ......
Read more >How to override Bootstrap CSS? - Themesberg
The most straightforward way of overriding Bootstrap styles is using plain old CSS. In this case, you will need to include your own...
Read more >How To Override Default Bootstrap CSS Styles - BootstrapDash
Import the bootstrap variables and functions into the custom.scss file. Now, add the code to change bootstrap default theme-colors and then add the...
Read more >Bootstrap custom CSS overrides - YouTube
We continue building our website implementing custom CSS and learning how to override the Bootstrap CSS.
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
try to move the css imports above
import Routes from './routes';
I think that’s because style-loader reads the css imported from components inRoutes
first rather than bootstrap. like thisAnd see if it works
For some reason this is not working for me. The index.js file does look different at this point. There’s no import of Routes.