Skip to content
  • Unlock Pro
  • Log in with GitHub
Solution
Submitted 5 months ago

Blog-Preview-Card

Shagun•70
@ShagunGupta-tech
A solution to the Blog preview card challenge
View live sitePreview (opens in new tab)View codeCode (opens in new tab)

Solution retrospective


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

I'm proud of how I built the Blog Preview Card using clean HTML and CSS, with a responsive layout and good use of rem units and Flexbox.

Next time, I’d focus more on accessibility, improve CSS organization, and maybe add subtle animations for better interactivity.

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

One challenge I faced was aligning all elements properly within the card while keeping it responsive. I overcame it by using Flexbox and rem units to ensure consistent spacing and layout.

Another challenge was implementing the hover and focus effects without breaking the design, which I solved by testing changes step-by-step and refining transitions for smooth interactivity.

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

I'd like help with improving accessibility, optimizing my CSS structure, and making the design more interactive with subtle animations.

Feedback on naming conventions and better mobile responsiveness techniques would also be helpful.

Code
Loading...

Please log in to post a comment

Log in with GitHub

Community feedback

No feedback yet. Be the first to give feedback on Shagun's solution.

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner
  • Use cases

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License