Tailwind: Apply class to child elements

Target all children

<div class="[&_p]:text-sm &_p]:text-gray-700">

Target only direct children

<div class="[&>p]:mb-4">

Target hover/state variants

<div class="hover:[&_p]:text-blue-600">

Target elements by data attributes

Suppose you want to target all descendant elements with the data-state="active" attribute. You can do that like this:

<div class="[&_[data-state=active]]:bg-red-600">