First / Last child for margin not working?

I’ve been playing around with pseudo class, but it’s seems margin won’t be affected by pseudo class?

e.g

# working
first:border

# not working
first:mx-0

[Dealerpriest]

You want to select the direct children with the > combinator in addition to using the :nth-child psuedo class. The nth-child psuedo class doesn’t automatically point at the children but rather asks if the currently selected object is the nth child. Perhaps a bit confusing as the word “child” is part of the psuedo class 😛 So. In your case you need to put & > :nth-child(3) inside the square brackets. Like so:

<div class="text-red-400 last:text-blue-500 [&>:nth-child(3)]:font-extrabold">
...

this will first target all direct children of the div tag with the > and then match the one which is the 3rd child

playground link: https://play.tailwindcss.com/1tRLpoO1zC

Additional Update: also be aware that if you want to use the last-child psuedo class, the name is actually :last-child. Not last, which is tailwind’s short utility name for it. [&>:last-child]:text-blue-400 https://play.tailwindcss.com/9pGwUY7QKe

[mehdad-hussain]

@robbyrice I am trying to use these two selector first and last but not working , could you please help me ? Tailwind Playground link