I am trying to develop a chrome extension (using React) widget which renders on all websites the user visits.
Due to the hindrance caused by the background website CSS, the design of the widget is breaking.
In other words, CSS of my chrome extension widget is interfered by CSS of the visited websites. On some of the websites, the widget renders fine while on other, it totally breaks.
To resolve, I have tried using unique ids and also the !important tag for my CSS but its still not working i.e. CSS is breaking differently on different sites. Here's the pictorial display of the issue.
Any help with approach to resolve this?
