Users hover and focus states for all interactive elements on the page

Community feedback

• 

  konja kuma sampson•270

  @DR-KSP-VIRUSPosted 6 months ago

  Hi @AlhassanMariam congratulation.

  So I have noticed you have not added CSS code for responsiveness. Try to learn about media queries to help you improve on your designs.

  Hope this helps.

  0
• 

  Victoria Azola Silva•1,290

  @VickyAzolaPosted 6 months ago

  Hi there! 👋 Awesome job completing this challenge.

  So, <button> and <a> are not meant to be together since they have different purposes:

  • button should be used when you want something to take action on the same page.
  • a is used when you have links that take you away from the page.

  In this case the more semantically appropriate tag is <a>

  <main>
  .....
        <a href="">GitHub</a>
        <a href="">Frontend Mentor</a>
        <a href="">LinkedIn</a>
        <a href="">Twitter</a>
        <a href="">Instagram</a>
  </main>
  

  Take the style on the button and add it to the a:

  a {
      text-decoration: none;
      color: hsl(0, 0%, 100%);
      background-color: hsl(0, 0%, 20%);
      width: 230px;
      height: 30px;
      margin: 5px;
      border-radius: 5px;
  }
  
  a:hover{
      color: hsl(0, 0%, 8%);
     background-color: hsl(75, 94%, 57%);
  }
  

  Hope this helps!

  0