I need to implement some kind of class scoping in Tailwind CSS. Each section of my site is in a different .php file (for example, hero.php, about.php, etc.). What I want is for Tailwind to generate separate CSS files for each section – for example, hero.css and about.css. The styles should be scoped using data-css=”hero” and data-css=”about”. So, in hero.php, I would use something like <section data-css=”hero” …>, and it should only apply styles from the hero section. Using tailwind v4 cli.
CSS: [data-css="Hero_test_hero_sekce"]
PHP: <section data-css="Hero_test_hero_sekce" class="relative h-screen bg-cover bg-center bg-no-repeat flex items-center">