How to make this first grid item have flex-start and the second one flex-end with grid-template-col?

is it possible to decide the grid-item placement from here while doing grid-template-columns? display: grid; grid-template-columns: repeat(2, 1fr); I want to make it so first 1fr is flex-start and other 1 fr is flex-end (justify self: flex-end)
12 Replies
Zoë
Zoë2y ago
So you want the left side to be held left and right to be held right?
Mert Efe
Mert EfeOP2y ago
yes !
Zoë
Zoë2y ago
Yes, that's possible, I'll whip it up for you
Mert Efe
Mert EfeOP2y ago
justify-self: start, and second grid item justify-self:end you know but I try to make it declared from grid-template-columns if possible thanks !
Mert Efe
Mert EfeOP2y ago
so you have to do 2nd child declared seperately &:nth-child(2n) { place-self: stretch end; }
Zoë
Zoë2y ago
Yes
Mert Efe
Mert EfeOP2y ago
is it not possible from doing it in here?
grid-template-columns: repeat(2, 1fr);
grid-template-columns: repeat(2, 1fr);
` no i think
Zoë
Zoë2y ago
No, it has to be on the child
Mert Efe
Mert EfeOP2y ago
ok thanks ! why did you prefer place-self over align-self any reason or?
Zoë
Zoë2y ago
I don't know, I should have used justify-self, edited the pen No problem, glad to have helped 😊
Mert Efe
Mert EfeOP2y ago
ahh okay thanks
Want results from more Discord servers?
Add your server