Tailwindcss not aligning element <li> as expected with utility space-y-3

Question

I'm trying to build navbar component in react with tailwindCss. I've added space-y-2 to get spacing on y axis, for all li elements. But the first li element (Home) is not getting spacing as expected. It looks like

Why Home is behaving differently ? Can anybody pls help

Here is Code

Answer 1

you can use the browser dev tool in the future to inspect and hover on the elements to see the problem

the answer: https://play.tailwindcss.com/aZtKENJcIw