I need help as google, AI and my search on Dev.to has resulted in no findings.

I'm somewhat new to Tailwindcss. I rewrote my whole site in it and it's working beautifully. It's performant for what I need.

However, I ran into an issue. First let's understand how I'm using it so you can tell me where I went wrong and how to fix it :P

My project started off with React. So we'll call it the "App".

Overtime, the performance and seo just wasn't cutting it so I realized I needed to move my blog portion over to a static setup, so I chose Nextjs.

We'll call this part of the site, the "Blog".

When I built the blog, I wanted it to share the same look and feel without repeating my work. So I abstracted out the component-library.

For simplicity, it's the "library"

So I have tailwind in all three. This might have been my mistake but I've seen it done before so I know it works.

App: React/Webpack
Blog: Nextjs
Library: React/vite

Tailwind configs all match for each project.

So both the App and the Blog, have their own tailwindcss index file as well as the Library tailwind file. It seems buggy.

95% of my styles work but others seems to be lost and confused by which one overwrites which.

I may have solved most of the issue last night by removing @tailwind base from the apps since it's passed through the Library but not all of them.

A few takeaways.

• I should have considered this at the start but I think I was just running with it being new to it.
• This shows that perhaps I did not read the docs fully. RTFM
• Yes, I'm aware Nextjs has zones which would allow me to share the apps. I chose apache2 as my server because I've seen better load times for the App.

Let me know if I need to add more details like how my site is actually configured with screenshots and what not.

If you help me fix this I'll buy you a coffee no problem! :)