0
151
ViewsRemove stylesheet only inside react app window
Image will best describe this:
code sandbox:https://codesandbox.io/s/annoying-stylesheet-2gpejc?file=/public/index.html
I'm writing React app inside non react app and their styles interfere with my React app styles.
How do I overwrite bootstrap-enterprise.css stylesheet only for the region of my React app without overriding the style rest for the rest of the page (The top app bar is theirs)
Edit:
.App {
all: revert;
}
worked initially, but then I tried it my real usecase (overrding Mui Textfield styling component) and it didn't. i edited the codesandbox for the exact case.
1 answers
Answer question0
Since your React app is separated from the rest of the app, you could use the all css property to reset all the styles inside your React app before to write yours :
/* Affect all the elements under .App */
.App * {
all: unset
}
In your codesandbox, adding it at the top of your styles.css seems to work fine.