PurgeCSS doesn't purge any display classes

[TheDutchCoder]

Describe the problem:

PurgeCSS does a great job with Tailwind, but as of the past version of Tailwind it doesn't strip any display related classes and I'm getting warnings about using display: contents; in combination with grid (I use neither).

[adamwathan]

It definitely purges the display classes but I bet what's happening is that the words "grid" and "contents" still appear in your templates, like:

<a href="#" class="bg-red-500">
  Click here to view the contents
</a>

...which would cause PurgeCSS to keep that class, since it's only performing a simple regex against the template contents.

PurgeCSS is introducing a blocklist feature soon that you could use to explicitly prevent these classes from being included:

FullHuman/purgecss#439

In the mean time I don't think there is a great workaround unfortunately, other than perhaps disabling the display plugin in Tailwind and providing your own plugin that only includes the display utilities you need.

One other workaround would be to use the experimental ie11 target mode just for the display utilities:

// tailwind.config.js
module.exports = {
  target: ['relaxed', { display: 'ie11' }]
}

...which would disable any utilities in the display plugin that don't work in IE 11, including grid and content.

Closing just because this is expected behavior and by design and don't have any plans to change anything here.

[TheDutchCoder]

You're absolutely right. It was the content causing this. Thanks!