social link profile using flexbox

Hello @mkhantk!

Your solution looks great!

📌 It's recommended to use semantic HTML elements like <ul> and <li> for creating lists. This ensures that your code is more accessible, maintainable, and semantically meaningful.

Here's and example on how you can refactor your code:

After Refactoring

<ul class="list-container">
    <li><a href="#">Github</a></li>
    <li><a href="#">Frontend Mentor</a></li>
    <li><a href="#">LinkedIn</a></li>
    ...
</ul>

By using <ul> and <li>, you convey the structure of your content more clearly, making it easier for screen readers and search engines to understand. Additionally, it aligns with best practices for HTML semantics.

I hope you find this helpful!

Keep up the excellent work!

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 actual <a> elements.

• This is the current markup,

<div class="social">GitHub</div>
<div class="social">Frontend Mentor</div>
...

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

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

• Additionally you need to add display: block rule for social so that we could properly place the socials on component.

• 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!