Problem when I update tailwind.config

[Tonyac-create]

What version of Tailwind CSS are you using?

^3.4.1

What build tool (or framework if it abstracts the build tool) are you using?

Next.js 15.0.3, postcss ^8

What version of Node.js are you using?

v20.15.1

What browser are you using?

Chrome or Mozilla firefox

What operating system are you using?

Windows

Reproduction URL

package.json

Describe your issue

I have a problem when I made a modification in the file tailwind.config.ts. all the rules doesn't work. I have tried to rerun the server, nothing yet. we don't have an error message in my console with VSC or in my navigator.

[philipp-spiess]

Hey! Do you mind adding the contents of your updated tailwind.config.ts so we can take a look?

[Tonyac-create]

`import type { Config } from "tailwindcss";

export default {
content: [
"./pages//*.{js,ts,jsx,tsx,mdx}",
"./components//.{js,ts,jsx,tsx,mdx}",
"./app/**/.{js,ts,jsx,tsx,mdx}",
],
theme: {
extend: {
colors: {
background: "var(--background)",
foreground: "var(--foreground)",
black: "#071520",
white: "#FDFDFD",
orange: "#F6A316",
turquoise: "#2AB8CD",
outremer: "#0D2D45",
},
backgroundImage: {
button: "linear-gradient(to left, var(--tw-gradient-stops))",
linear: "linear-gradient(to right,var(--tw-gradient-stops))",
custom:
"url('/backgrounds/Body_1_MissTerry_1.png'), url('/backgrounds/Body_1_Mesh_CC_Fnl_1.png')",
},
backgroundPosition: { "right-bottom": "right bottom" },
backgroundSize: {
customsize: "20%, 100%",
customsize2: "11%, 70%",
customsize3: "9%, 56%",
customsize4: "8%, 50%",
customsize5: "7%, 45%",
customsize6: "6%, 38%",
},
screens: {
"customLi": "440px",
"customLi2": "500px",
"customLi3": "600px",
"2xl": "1400px",
"3xl": "1536px",
},
padding: {
"1px": "1px",
"2px": "2px",
"3px": "3px",
"5px": "5px",
},
margin: {
"10px": "10px",
},
width: {
"1px": "1px",
},
},
},
plugins: [],
} satisfies Config;`

If I modify a rule or add a rule, the CSS broke.