1

I have a Materialize menu that i use in other areas of my website and i tried to import it into Wordpress. With a few edits its been successful and the menu is running fine. you can see it working here

The issue i'm having now is that the external css called to use Materialize has overridden of the css in wordpress/my theme.

Does anyone know how to limit the Materilize css to one element on a website, in this case it'd be my menu div.

here's the scripts i called to get Materialize to work. I found that i had to make small edits to the menu which was built for a standard html page, but nothing too significant, other than calling these scripts. ja little trial and error needed to get to where i am now.

 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.98.0/css/materialize.min.css">
<script src="https://code.jquery.com/jquery-2.2.0.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.98.0/js/materialize.min.js"></script>

edit: this question is different from this one because scoped css is depreciated (the 1st answer), and i can't wrap it in the div in my css file as the css being called is an external one, quite a large one, from Materialize (the second answer)

ProEvilz
  • 5,310
  • 9
  • 44
  • 74
Andy at Focallocal
  • 176
  • 1
  • 12
  • Possible duplicate of [Limit scope of external css to only a specific element?](https://stackoverflow.com/questions/17667874/limit-scope-of-external-css-to-only-a-specific-element) – Jordan Miguel Apr 19 '18 at 16:16
  • I can't help but say... but it seems simple to re-create this menu - especially now that you have some source code to reference? – ProEvilz Apr 20 '18 at 01:22
  • i'm not a particularly good developer. i had a recreation i made on that page before but it had a few issues and didn't look exactly the same without calling the materialize css. i decided to try and get the same menu working on each page across the website. i'm working on individual fixes, i was just hoping someone here knew how to stop that css file from interring sitewide on a wordpress install. anyway, my situation doesn't change that the question might be useful for others who have issue with externally loaded css in the future – Andy at Focallocal Apr 20 '18 at 11:57

0 Answers0