Stats preview card component

Solution retrospective
Hello Coders,
This is already my third design and this one was challenging but I had a lot of fun coding it.
What is the best way to approach the design? Is the best way mobile first or desktop first? I know that people now a days use their mobiles phones the most, so i would say, mobile first. But i find it harder to begin with mobile first.
In my css style.css at the bottom of al my code i have the code for de screen-size of 375px.
Is that good practice to put it beneath my code or is it better to make a new file, name it screen-size-small.css and link it in the head of the html document like <link rel="stylesheet href="screen-size-small.css">
?
I am also struggling what to use to make a layout, flexbox or grid. First i started with flexbox but i ran into some problems that the left and right side of the card where not excatly the same size. And also when resizing with flexbox the image got squeezed instead of scaling down. Then i tried css grid that worked alot easier. When do you use flexbox or grid or is that just your own preference?
I would like to get some feedback. :)
Thanks in advance,
Danny
Please log in to post a comment
Log in with GitHubCommunity feedback
No feedback yet. Be the first to give feedback on dvbenthem's solution.
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord