@Alex-Archer-I
Posted
Hi again!
Hey, the list of links here is perfect example when you can use flex-gap instead of margins. You need to apply it to the ul element.
.socials {
gap: 1.2em;
}
The pros is these gaps will be only between the links, meanwhile margin-top pushed first element from the top.
Well, padding is one convenient ways to 'stretch' the elements especially inline ones. You can try to use percentage values, but I not recommend you cos percentage of paddings and margins depends of the width of the parent element and therefore could be a bit unpredictable. There is no harm to hardcode a little =)
Your work is really improved, by the by =) Good luck =)
Marked as helpful
@aduatgit
Posted
@Alex-Archer-I
Thanks a lot for the feedback!
I agree, using flex-gap is definitely the more elegant solution. I tried doing it at first and had some issues with it before i styled the buttons (since you need to add another display: flex to the ul, unless there's some other way to do it). I just tried implementing it with flex-gap again and it works like a charm!
Also thank you for the feedback on the padding, sometimes I overengineer things so it is good to be reminded that simple solutions sometimes just work haha!
@Alex-Archer-I
Posted
@aduatgit
Yep. gap can be used only with display: flex and display: grid. Guess that another one thing I forgot to mention. I should to get into habit to collect thoughts before write a feedback, especially after a few hours of coding =)
(Also you need to set flex-direction of this list to column to keep vertical alignment, but I guess you are already know about this)
I think it is quite a good trait - to look for a better, more efficient and flexible solutions. It's a way to learn and improve. Just gotta keep balance. I can advice it to myself in some kind =)
Anyway, keep doing, fell free to ask or comment if need. I'll try not forget important stuff =)
