Tailwind Arbitrary Values
This is parent
ul
Any ideas why this is not working ? I am trying to change padding for the second child and it just doesn't work. I tried with self-reference &
, &*
, &>*
. The last 2 not exactly sure how it works. I assume this >
is used for children elements to point they parent and *
to select all of the elements. Correct me if I am wrong.14 Replies
are you trying to set 2 different gap values?
you can only have 1 gap value gap is not margin or padding
you can't set different sizes for children
Yes. But from your question I realized I am doing something wrong. What I generally wanted is to have gap-2 for all <li> and for the second and third to have gap-1. But just realized I want the first and second gap be smaller. And you just mentioned it is not a margin or padding. Any solutions for it ?
you have use margin on the children to space them how you want them
I guess I should set initial gap-1 and the rest to have margin
to fill the rest
Thank you.
yup set the gap and the add more space with margin basically
Alright. Let's say if I want to have
gap
only once but start from the third-child
? Could that work since it will be only be one gap
? I guess question would be how to do it :/nope gap is for all childreen
Damn, it would be nice to disable selected gap.
Like gap:remove(odd,even, 2, etc.)
Or something like that.
maybe one day 🙂
Thank you for answering.
np good luck with your coding
Thank you. I was stuck with side-nav bar but I managed to re-make it someone else. I was learning grid-box and some html 5 tag usage like nav, sections. I know those are not a must but I wanted to learn for easier distinction. Tho I am still unsure if section is allowed in nav.
you could do something like this.
Set the gap size to a custum property.
And then with the item:nth-child() you can adjust the margin-top to -1*gap
https://codepen.io/MarkBoots/pen/WNPmwqx?editors=1100
I ended up with this.
https://codepen.io/LCSNeo/pen/VwggLRO
I am sure there is plenty of ways to improve on it probably.