Social Media Dashboard With CSS Grid And Light/Dark Theme Transition

@Octagon-King

Thanks! 😀

I used flexbox to lay out the elements in the first row of cards on the page and CSS grid to lay out the elements in the the rest of the cards. I think keeping the icons in place when the size of the screen changes is a matter of making sure the icons are correctly placed within their container (which you can do with properties like justify-content or align-items for flexbox and align-self and justify-self) and that the size of the card itself is large enough for the items inside it (so that they don't get squished or start being pushed around). 😉 Feel free to use the dev tools to inspect the code for this solution and poke around. Doing that often helps me learn a lot from other people's solutions. 😅

@ApplePieGiraffe Thanks! I did it and I was using flexbox for the second small cards too but when I start using grid it made it easier and less code.

Thanks again. 😉 for a Helping a Newbie

@ApplePieGiraffe Here you can see what i have done: https://distracted-noether-27fb8c.netlify.app

@Octagon-King

No problem! 👍

The layout of the cards in your site is looking pretty good, right now! 😀

@ApplePieGiraffe Thanks man

@brasspetals

Thanks, Anna! 😊

@BerylBucket

Haha, thanks! I still have much to learn... but I guess I'm becoming a little more familiar with a few things. 😊

Happy coding!

@artimys

Thanks artimys! 😁

@tediko

I was actually thinking of doing something like that but I just got lazy and went with using flexbox to quickly change the position of the circle element. 😆 But as you suggested, I think the tiny bit of extra effort would be worth it, though! 😁

Thanks for the feedback! 😊

@doums85

Thank you!