Social links profile using flexbox

Hi @biwwabong,

Nice project! Here are a few suggestions:

Simplifying HTML: You don’t really need to use <li> tags in certain cases, as they can make your code unnecessarily nested. In CSS, simpler and less code is generally better, with some exceptions.

OG Meta Tags: Given the shareable nature of this project, consider adding OG meta tags to create beautiful, shareable links and improve SEO.

Using target="_blank": Practice using target="_blank" to make links open in a new tab, which is best practice for most links to avoid removing the user from your site.

Keep up the great work!

Best, Teodor

I think setting the ul width 100% is good, it is simple. As long as the container (the card) is responsive, the ul will be responsive, as it always takes all the width of its container.

I would use text-align to center the text in each li and not set each li and a width to 100%. https://codepen.io/edpau/pen/wvLYmwv

In my solution for responsive design, I set my card width to 90vw in mobile, and set a max-width with media query (min-width: 400px) to stop the card grow too large. The button's width will grow with the card width.