Centered card layout using Flexbox

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

I'm proud of how clean and responsive the layout turned out using only HTML and CSS. I managed to center the card perfectly on the page using Flexbox and styled the elements to match the design spec closely. I also maintained a clean, organized structure in my code with meaningful class names and a mobile-first approach.

This project helped me get more comfortable with layout techniques and responsive design.

I'd also consider implementing dark mode support or adding a small animation to make the UI feel more interactive.

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

At first, centering the card both vertically and horizontally was tricky. I tried using margins but it didn’t work consistently across screen sizes. ✅ Solution: I used Flexbox on the body to center the .inner_container perfectly, even on small screens.

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

I’d love feedback on whether my CSS structure and class naming follow best practices. Are there ways I can make my styles more modular or maintainable?

While the layout looks good on mobile and desktop, I’d appreciate suggestions on how I could make the design even more responsive, or if there are better techniques I could use.