@Ishmaelsealey
Posted
Hi @M-AminAlizadeh
Well done on completing this challenge! It looks great!
I have a suggestion for you. I noticed that you did not use any headings in the entire document. I think you could place the name of the person in an <h1>
.
Using headers provides structure to the page for screen readers to use when navigating a site. It is primarily for accessibility. The name can still be styled as it is, just in an <h1>
.
Next, you can also use CSS grid to make the three "statistic" sections at the bottom. It is achieved by using the following code on the profile-card__social-info
class
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-gap: 20px;
The 1fr
means a fraction of the available space and the grid gap is similar to a margin between each grid item!
That being said, utilizing flexbox is a great way of achieving the end result, I just wanted to share another way it could be done! ✌️
Hope you found my suggestions helpful!
Happy Coding ✈️
Marked as helpful
@M-AminAlizadeh
Posted
Thank you @Ishmaelsealey for your precious suggestions