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-profile

@vuthoai02

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?

Please provide your feedback to help me improve the project. Thank you.

Community feedback

@DebabrataBanik

Posted

Since your design is a single-component layout, you can simplify things by using a fixed width like width: 300px. This will keep the component consistent across different screen sizes without needing to worry about percentages or additional properties.

However, for designs where responsiveness is more important, consider using a percentage-based width along with a max-width. For instance, setting width: 90% helps the component adapt to smaller screens and fill most of the viewport. Using max-width: 300px (or a suitable value) ensures it doesn't become too wide on larger screens.

Also, be sure to change the source of your img file to the profile picture.

Great work on the design overall! Hope this helps!

Marked as helpful

1

@vuthoai02

Posted

@DebabrataBanik Thank you for reviewing my project, your feedback is quite helpful. Due to my habits, I tend not to set fixed dimensions for containers, as I’m concerned about aspect ratios. This is a simple design, and as you mentioned, fixing the dimensions shouldn't be an issue. For responsive design, using percentages is also appropriate, and I respect your contribution. Regarding the project images, I haven't been able to find a suitable one that looks like the one I intended, so I'm using a placeholder for now. I hope it doesn’t affect anyone's perception. Once again, I really appreciate your feedback on my project, and I wish you a productive day ahead.

1

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