Hey. Great article and super clear breakdown. I really like how you do one property at a time.
With flex-grow you mention flex-grow of 2 making that particular element twice the size of the others - that's one to be careful of. It doesn't mean twice the size, but that the element will expand to fill empty space twice as quickly.
flex-basis: 0; would do the same. It's not always the behaviour you want though - sometimes you want items to only shrink to a certain size before they wrap.
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Hey. Great article and super clear breakdown. I really like how you do one property at a time.
With flex-grow you mention flex-grow of 2 making that particular element twice the size of the others - that's one to be careful of. It doesn't mean twice the size, but that the element will expand to fill empty space twice as quickly.
If you add
min-width: 0;on everything I think it sizes based on total space not just space available.flex-basis: 0;would do the same. It's not always the behaviour you want though - sometimes you want items to only shrink to a certain size before they wrap.