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

FAQsocial link profile

@kevin20001022

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 specific areas of your project would you like help with?

Fonts & Margin plz

Community feedback

MikDra1 6,070

@MikDra1

Posted

Nice one @kevin20001022 😊

If you want to improve you should add an active state to the button. As for fonts and margins it is really hard to get them ideal, but you can try. As a hint you should look into style-guide.md file that you get in resources where is specified how big the paragraph should be.

If you find this comment useful please mark it as helpful 💗

Good job and keep going 😀😁😊

1

@turtlethom

Posted

Hey kevin20001022, nice job on completing your project! I like your attention to detail when it comes to spacing elements. I saw you needed some help with margins and font size, so here are some techniques I can recommend:

  • Instead of using the px unit, I would recommend using rem or em units for your padding/margin sizing. They are helpful for making more maintainable designs. You can learn more about why they are more useful to use here. CSS Units When To Use One.
  • For dynamic font-sizes, you can utilize the clamp function to keep the font size 'clamped' between a minimum and maximum value. I've left a resource here for you to learn more about it if you'd like to use it in your projects. CSS Clamp.

Hopefully this helps. Keep up the great work :)

0
MikDra1 6,070

@MikDra1

Posted

If you have time try to make your component 100% responsive on all the screen sizes. If you don't know how to do that here is a hint from me ->

Make your card width 90% on small screen sizes and then also add to your card a max-width so it will always stay between 90% and the max-width. To center the card add also margin: 0 auto;

If you find this comment useful please mark it as helpful 💗

Good job and keep going 😀😁😊

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