@Hassiai
Posted
Add aria-label attribute aria-label=" " to the <a> of the social media icons to fix the error and accessibility issue. The value of the aria-label is the description of the image. For more aria-label click here
For the left and right sides space of the page, give the main a max-width of 1440px, a width of 80% and margin: 0 auto.
main{
max-width: 1440px;
width: 80%;
margin: 0 auto;
}
Use relative units like rem or em as unit for the padding, margin, width values and preferably rem for the font-size values, instead of using px which is an absolute unit. For more on CSS units Click here
Hope am helpful.
Well done for completing this challenge. HAPPY CODING
Marked as helpful
@keziarkts
Posted
Hi @Hassiai, thanks so much for your great feedback! When Frontend Mentor website pointed out those errors after submitting my solution, I didn't know how to fix them. So thanks to you now i know what aria-label is for :)
Regarding units, I was indeed already advised to use rem for font-size value, but I didn't know that it was better to use em for the padding, margin, width values. Because I saw so many people using px units.
Finally, you gave me a big hand when it comes to understand how manage the left and right sides space of the page (really, i mean it!) I got it now 😭👍
Now i'll make sure to use these awesome and helpful tips to update my solution (and future challenges)!
THANKS A LOT!
Happy Coding 😊
