[v4] How to disable container?

[lihanspace]

[v4] How to disable container?

In v3 there was a corePlugins option you could use to completely disable certain utilities in the framework. This is no longer supported in v4.

/** @type {import('tailwindcss').Config} */
module.exports = {
  corePlugins: {
    container: false,
  },
}

[wongjn]

No real way to disable it, you can only unset its properties:

@utility container {
  max-width: unset;
  width: unset;
}

[GrimLink]

Not sure why this the answer 😕
Since this create extra CSS, since it only overwrites the default values.

[rozsazoltan]

@GrimLink At the time of writing the answer, @source not was not yet available in v4.0. This explains Wongjn's statement "No real way to disable it" at that time (2025-02-07).

It was later introduced in v4.1 (2025-04-01) in answer to demand, so just go ahead and use it:

@source not inline("container");

• Add @source inline(…) #17147
• https://tailwindcss.com/docs/detecting-classes-in-source-files#explicitly-excluding-classes

And yeah, you're right - the downside of this is that you can't declare your own utility named container.

• [v4] add support for disabling core plugins #16132 (reply in thread)

[aschmid1]

I was able to disable it with

@source not inline('container');

which is described in https://tailwindcss.com/docs/detecting-classes-in-source-files#explicitly-excluding-classes.

[rozsazoltan]

That's right - in v4.0, there was no option for "disabling", but starting from v4.1, the feature you mentioned was introduced:

• Add @source inline(…) #17147