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

Social links card using semantic html elements

z-mn 150

@z-mn

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?

Which are the most effective CSS properties for responsiveness and how should I be using min-width/max-width and height properties.

Community feedback

Boris 2,870

@mkboris

Posted

Great job on completing this challenge, Flexbox and Grid are effective for responsive layouts which you already applied to your solution, also using media queries for applying styles based on screen size. min/max width should be used to ensure elements scale within specified limits and should not be set using fixed units. You will rarely need to set heights as you should let the element's content and padding determine it's size.

Some suggestions for your solution

  • All content should be wrapped within landmarks. Wrap a main tag around your card.
  • Your card's max-width should be in rem
  • Font-size should be written in rem.

Marked as helpful

0

@Tiwari0808

Posted

With basic knowledge of Html and css,solution is easy.

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