Skip to content
Submitted about 2 months ago

Responsive blog card using HTML, CSS Media queary

Joshua Utik•30
@joshutik
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Blog preview card
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

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

What I am most proud of is able to Understand the usage of Min and the Max usage in media query.

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

Making the responsiveness on various screen sizes.

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

For now none I guess.

Community feedback

  • MikDra1•6,980
    @MikDra1Posted about 2 months ago

    Well done, here are some things to review 😊:

    • Overusing div tags: Try using more semantic HTML elements like <section>, <header>, and <article>. It’ll help with both accessibility and SEO.

    • Neglecting responsive design: Make sure you're using media queries and following a mobile-first approach so your site looks great on all devices.

    • Inconsistent class naming: It’s easy to end up with a mess of class names. Consider using a system like BEM for better organization and scalability.

    • Using px for everything: Instead of px for fonts and layouts, try using relative units like rem or em to make your design more adaptable to different screen sizes.

    Hope you found this comment helpful 💗💗💗

    Good job and keep going 😁😊😉

    Marked as helpful
    0
    Joshua Utik•30
    @joshutikPosted about 2 months ago

    Thank you this was really Helpful @MikDra1

    0
  • Giannis Mylonas•80
    @mylonakos14Posted about 2 months ago

    This is an amazing job . Keep it up!

    0

Please log in to post a comment

Log in with GitHub

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