SOCIAL LINKS PROFILE

What are you most proud of, and what would you do differently next time?

I’m most proud of how I created a clean, fully centered, and responsive social profile card with a sleek dark theme. I managed to handle the layout and styling just right so it looks great on different screen sizes — all with pure HTML and CSS, no frameworks. Also, I polished the hover effects on the social links to give a nice interactive feel!

Next time, I’d focus more on accessibility — making sure the colors have enough contrast and adding proper ARIA labels for screen readers. I’d also like to experiment with CSS animations or transitions to enhance the user experience even more.

What challenges did you encounter, and how did you overcome them?

One of the main challenges I faced was resizing the container and all its content so that the profile card wouldn’t overflow or fill the entire page. Initially, the container was too big and caused unwanted scrolling, which broke the fixed layout I wanted.

To fix this, I had to carefully adjust the container’s width and height, and scale down the font sizes and padding inside it to make sure everything fit neatly in the center of the viewport. I also used CSS Flexbox properties like justify-content and align-items on the body to perfectly center the container both vertically and horizontally.

Finally, I set overflow: hidden on the body to completely remove scrolling, so the page feels like a fixed, clean single card. This process taught me a lot about balancing responsive sizing with fixed layouts.

What specific areas of your project would you like help with?

I’d love feedback on the overall design and responsiveness — especially how well the profile card scales on different screen sizes. Also, if there are any suggestions for improving the CSS structure or making the code more efficient, that would be super helpful. Finally, I’m open to tips on accessibility and best practices to make the project even better!