Responsive Blog Preview Card using CSS grid

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

I'm most proud of how clean and responsive the final layout turned out using only HTML and CSS. I was able to implement modern techniques like Flexbox for alignment and the clamp() function for responsive typography without using media queries. Additionally, using BEM naming conventions kept my CSS organized and maintainable, which made the project feel more professional and scalable.

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

One of the main challenges I encountered was making the web page responsive without relying on conventional CSS media queries. I wanted to maintain responsiveness while keeping the CSS lean and scalable.

To overcome this, I explored and implemented the CSS clamp() function for responsive typography and spacing. This allowed me to define flexible values that adapt based on the viewport width, effectively replacing the need for media queries in many cases. It was a learning curve at first, but it helped me understand how modern CSS features can simplify responsiveness in web design.

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

While I'm proud of the current implementation, there are a few areas I'd like guidance or feedback on to improve further:

Responsive Design Without Media Queries: I used the clamp() function to handle responsiveness, but I’m still exploring best practices for using it effectively across different elements like padding, margins, and container widths.