Stuck on an issue?
Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.
And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.
How to make sure styles apply to only a component
See original GitHub issueWhen I added these imports; import 'bootstrap/dist/css/bootstrap.css' and import 'bootstrap-vue/dist/bootstrap-vue.css', to a component I want to use, I realized that the styles got applied globally to other pages. How do I make sure it applies only to markup of that component?
Issue Analytics
- State:
- Created 6 years ago
- Comments:9 (2 by maintainers)
Top Results From Across the Web
Applying CSS stylesheet only to active component
Use simple CSS technique. Suppose you have two components with different css files (say about.css and contact.css). Now consider your both ...
Read more >Component styles - Angular
Sometimes it's useful to apply styles to elements within a component's template based on some condition in an element that is an ancestor...
Read more >Styling Components In React - Smashing Magazine
CSS or SCSS Stylesheets is a styling strategy that involves the use of external CSS or SASS stylesheets that can be imported into...
Read more >4. Four ways to style react components | by Agata Krzywda
There are four different options to style React components. All depend on your personal preferences and the specific complexity of your application.
Read more >How to Style Your React App – 5 Ways to Write CSS in 2021
Writing CSS in a stylesheet is probably the most common and basic approach to styling a React application, but it shouldn't be dismissed...
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
I will bring this topic back to life. I’m having the same issue that the css applies to all the pages even after defining a
<style scoped/>section. Can someone please help me?Okay so what I did is just write a new css file, because the bootstrap one was overwriting my actual css or scss files that I am using globally in my application