Submitted 8 months ago

Social Links Profile- Main

tucecifci•150

@tucecifci

Preview site View code

This is a solution for...Social links profile

HTML
CSS

1newbie

Design comparison

SolutionDesign

Solution retrospective

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

I finished the project in less time than I anticipated, and I felt proud of myself for setting up a semantic HTML document.

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

The background color was too close to the container color, adjusting the colors' codes took me some time, but then I realized I should leave it as it was, there seems to be an issue with my screen.

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

I completed my project without needing help in any area, but of course, I'm not sure if it followed best practices.

Community feedback

Gautam Sarkar•850

@gautam32b7Posted 8 months ago

Hi there!

Great job! I reviewed your code and found some mistakes. A few tips:

:root {
    --green: hsl(75, 94%, 57%);
    --White: hsl(0, 0%, 100%);
    --Grey: hsl(0, 0%, 20%);
    --Dark-Grey: hsl(0, 0%, 12%);
    --Black: hsla(0, 0%, 8%);
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    letter-spacing: 0.06rem;
}

Always put the reset at the top

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    letter-spacing: 0.06rem;
}


:root {
    --green: hsl(75, 94%, 57%);
    --White: hsl(0, 0%, 100%);
    --Grey: hsl(0, 0%, 20%);
    --Dark-Grey: hsl(0, 0%, 12%);
    --Black: hsla(0, 0%, 8%);
}

Proper way to structure the HTML links

  <div>GitHub</div>
      <div> Frontend Mentor
      </div>
      <div>LinkedIn</div>
      <div>Twitter</div>
      <div> Instagram
      </div>

<ul>
<li><a href="#">Frontend Mentor</a></li>
<li><a href="#">LinkedIn</a></li>
<li><a href="#">Twitter</a></li>
<li><a href="#">Instagram</a></li>
</ul>

Please log in to post a comment

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