You’re referencing a CSS selector/format used in some tooling (likely a shorthand or custom syntax). Interpreting as: “py-1 [&>p]:inline” — this looks like Tailwind CSS utility + JIT arbitrary variant that targets direct child
elements.
What it does (reasonable assumption):
- py-1 — applies padding-top and padding-bottom: 0.25rem (Tailwind default).
- [&>p]:inline — using Tailwind’s arbitrary selector feature, it sets direct child p elements to display: inline.
Equivalent CSS:
css
.selector {padding-top: 0.25rem; padding-bottom: 0.25rem;}.selector > p { display: inline;}
Usage:
- Apply to a wrapper element to add vertical padding while forcing immediate
children to be inline (useful when you want paragraph tags not to create block breaks).
- Works in Tailwind v3+ with JIT and arbitrary variants enabled.
Caveats:
- [&>p]:inline only targets direct children ( > p). Use [&p]:inline or [&>p]:inline-block variants for different scopes or displays.
- Ensure your Tailwind config allows arbitrary variants if using strict safelisting.
Leave a Reply