5

I have imported a CSS file with global styles in the top-level file index.js.

...
import React from 'react'
import ReactDOM from 'react-dom'
import './global.css'
...
ReactDOM.render(
    <Router>
      <App />
    </Router>,
  document.getElementById('root'),
)

I wanted global.css to apply to all of the react components(pages) below.

However, in certain components, the global.css added globally causes problems and I hope to disable it in certain components.

For example, I need to disable only 3 to 4 components out of 50,

so I want to remove the css file added globally only in specific components.

How can I solve it?

I don't want to add global.css only to the screens I need.

That file needs to be added to index.js, and I want to disable global.css only in certain components.

Kevin Park
  • 71
  • 3
  • Hove a look at [Is there a way to tell an html element to ignore any stylesheets?](https://stackoverflow.com/a/36892781/128165) – Gabriele Petrioli Nov 06 '20 at 18:20
  • There is a similar question and answer here https://stackoverflow.com/questions/57636729/how-to-exclude-global-styles-in-a-react-app – Ozgur Sar Aug 31 '23 at 06:31

0 Answers0