Essentially you have a few options:
.containerin the drop down list into something more semantic like
.dropdown-container. You’d need to do that inside the HTML and CSS of course.
- Add a second class to the
.containeron the drop down and then adjust the CSS to include both only
- Add another wrapper and add that wrapper to the selectors in your CSS to make it even more specific
Out of all those options (and there are probably a few more), the first one is definitely the best. You get a much more meaningful container name + it makes it easier to modify long-term.
This is solved in other languages with namespacing, and in the future we can solve it by manipulating the shadow DOM, but that might be getting ahead of ourselves :)