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 Link Profile Hover Responsive

@aryanmalik099

Desktop design screenshot for the Social links profile coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

@mike15395

Posted

hey @aryanmalik099 Congratulations on completing the challenge! You are very close the design.

Here are few improvements which can be incorporated easily so that is much closer to design: -inside your css file, increase the padding-top by 2px

.container ul {
    list-style-type: none;
    display: grid;
    gap: 10px;
    padding-top: 18px;
}
  • inside your css file, set some height to container in percentages like 75%.
.container {
    background-color: var(--dark-grey);
    max-width: 400px;
    width: 75%;
    height:75%,
    padding: 24px;
    border-radius: 16px;
    text-align: center;
}

If you make the above changes in your code, your solution will be almost same as design. do let me know if it works well.

Another thing you missed is proper readme file, please read the read me template and make changes accordingly.

Rest your code is very clean and properly maintained.

Keep growing!

Happy coding:)

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