Some Tailwind classes do not work

[AvivShvitzky]

Tech: Tailwind the latest version, Next.js 12

Hi, I have a weird occurrence where some elements in my file have their tailwind classes create CSS properties for them, and some do not.
You can see in the image provided that nothing is being applied on the browser. I can ensure that the window is 1800px wide, and the view is 100%, so this is not a breakpoint issue.

I've run this command: npx tailwindcss -i ./styles/globals.css and in the output generated, the classes that aren't working do not appear. It is as if they haven't been compiled or something.
I've also reinstalled tailwind and its dependencies, checked on multiple browsers, etc.

This is my tailwind config:

module.exports = {
  content: [
    './pages/**/*.{js,ts,jsx,tsx}',
    './components/**/*.{js,ts,jsx,tsx}',
    'node_modules/preline/dist/*.js',
  ],
  darkMode: 'class',

  theme: {
    extend: {},
  },
  plugins: [
    require('@tailwindcss/forms'),
    require('@tailwindcss/line-clamp'),
    require('preline/plugin'),
  ],
};

[adamwathan]

What's the path to the file containing the classes like md:m-auto? Is it for sure covered by your content configuration?

[AvivShvitzky]

Yea, this is the path:
pages\dashboard\somePage\[id]\index.js

[adamwathan]

Can you create a proper reproduction I can clone down to troubleshoot?

[AvivShvitzky]

I can create the static page on a sandbox, but I cant put the whole project cause it uses db and many env and stuff, so it wont work

[AvivShvitzky]

I have new info and opened a new ticket, I don't know how to close this one :(

[reezayn]

Hi @AvivShvitzky
Did this got fixed?
I was having the same problem so can I know the solution?

[Awohot1]

Try to run watch command
npx tailwindcss -i ./src/input.css -o ./dist/output.css --watch

And then reload the browser