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

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.

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!