Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

CSS presets used for the first time. Media queries used too!

P
Danny 110

@DannyGuerin

Desktop design screenshot for the Social links profile coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


What are you most proud of, and what would you do differently next time?

I did this project using CSS presets for the first time and am really happy with how it went. I'll definitely be using them for every project going forward. I also implemented media queries for the first time and it was much easier than I thought it was going to be. New hover interactions were also used. I'm very happy with how this turned out.

What challenges did you encounter, and how did you overcome them?

Never doing CSS Presets or Media Queries too some time to figure out but now that I know them, things will hopefully get much faster and more streamlined in the future.

What specific areas of your project would you like help with?

I think everything went ok and is looking good but if you see anything I missed or ways I can improve my code, please let me know. Thanks.

Community feedback

@YacoubDweik

Posted

Wow! Only an extra 5px margin at the bottom of the name and you got the perfect copy of the design! I would only recommend not to use width: 23.5rem cus your design gets already some overflow below 375px screen size! People think that rem is gonna be responsive and you wouldn't have any trouble but this is not true, cuz at the end of the day 23.5 * 16px for example equals a fixed number so it is not responsive at all, instead of using width you can use min or max width which gives you some responsive behaviour, keep it up!

Marked as helpful

1

P
Danny 110

@DannyGuerin

Posted

Thank you very much @YacoubDweik! :-)

1

@mdchong

Posted

Your solution looks quite similar to the design provided! As I lack knowledge of coding, I am not sure if I am in the place to give a helpful feedback. I am glad you used CSS presets as they are really helpful! I've recently received a feedback that there are many resets out there and it will be really helpful to understand why they were written that way.

Marked as helpful

0

Please log in to post a comment

Log in with GitHub
Discord logo

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