TailwindCSS Tricks

Tips & Tricks

Apply styles to child elements

Useful, for example, when you want to capture the hover over the whole parent but apply different effects to specific children. Select the child using [&>child] — you can apply classes to the child like this:

<div id="parent" class="hover:[&>#child]:some-class">
	<span>...</span>
	<span id="child">...</span>
</div>

Resources

[todo]