Social links profile

Community feedback

• 

  T

  Grace•31,090

  @grace-snowPosted 6 months ago

  A few more pointers

  • don't skip heading levels (h1 to h5. Heading levels have nothing to do with size, and everything to do with meaning (semantics).
  • this design actually only has one heading. London isn't a heading for all those links. It's just a paragraph.
  • the links should be in a list
  • the card shouldn't have a min width it should have a max width.
  • Everything in your solution looks smaller than the design. But some of the text in this is tiny! Like I can't read it that small.
  • there is no need for a media query in this challenge.
  • only use flexbox when you actually need it.
  • instead of using complex css selectors like direct child selectors, try to keep the specificity as low as possible. Place classes directly on what you want to style.

  0

  ---

  

  Zehn77•60

  @Zehn77Posted 6 months ago

  @grace-snow Thanks a lot for your code review !

  0
• 

  Abdul Khaliq 🚀•72,580

  @0xabdulkhaliqPosted 6 months ago

  Hello there 👋. Congratulations on successfully completing the challenge! 🎉

  • I have a suggestion regarding your code that I believe will be of great interest to you.

  ---

  MAKING ACCESSIBLE LINKS:

  • The links like Github, Frontend Mentor are needed to be are wrapped up using li and ul elements. It improves the accessibility of your solution with good semantics.

  ---

  • This is the current markup,

  <div class="social_links">
      <a href="#">GitHub</a>
      <a href="#">Frontend Mentor</a>
      ...  
  </div>
  

  ---

  • In order to make this solution accessible, we need to use <a> elements with href attribute. Here's the example

  <ul class="social-links">
      <li>
         <a href="#">Github</a>
      </li>
      <li>
         <a href="#">Frontend Mentor</a>
       </li>
      ...
  </ul>
  ....
  

  ---

  • If you have any questions or need further clarification feel free to reach out to me.

  ---

  .

  I hope you find this helpful 😄 Above all, the solution you submitted is great !

  Happy coding!

  0

  ---

  

  Zehn77•60

  @Zehn77Posted 6 months ago

  @0xabdulkhalid Thanks a lot for your code review !

  0

  

  Abdul Khaliq 🚀•72,580

  @0xabdulkhaliqPosted 6 months ago

  @Zehn77 Glad you found it helpful ! 🤠

  0
• 

  Mine•90

  @MineshayePosted 6 months ago

  Pls how did you align the card at thr cecter vertically,I did that with align items center but it did'nt work.

  0

  ---

  

  Zehn77•60

  @Zehn77Posted 6 months ago

  @Mineshaye display: flex, align-items: center, justify-content: center; You can see it, on the github proejct: https://github.com/Zehn77/-Social-links-profile

  1

  

  Mine•90

  @MineshayePosted 6 months ago

  @Zehn77 okay thank you.

  0

  

  Mine•90

  @MineshayePosted 6 months ago

  @Mineshaye I should have changed the height the page to 100vh .

  0

  

  Zehn77•60

  @Zehn77Posted 6 months ago

  @Mineshaye min-heigth: 100vh

  0

  

  Mine•90

  @MineshayePosted 6 months ago

  @Zehn77 thank you

  0