Skip to content
Submitted about 1 month ago

Blog Preview Card solution with Media Queries

Rodrigo Policarpo Meireles•40
@Rodrigo-Policarpo
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?

I'm proud to finish this challenge with a little more knowledge about responsiveness and 'hover' properties. Next time, I would do the responsivity of my project differently than this project, because I did not complete the challenge of creating responsiveness without Media Queries.

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

The first challenge was getting used to Figma. Contact with the tool along throughout the challenge was very usefull for me to get used to it. The second challenge was to create text responsiveness without Media Queries, which unfortunately, I couldn't find anything concrete to base myself on and learn correctly, which made me use Media Queries in the end.

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

I would like help with the card's text responsiveness without using Media Queries, and opinions on whether I used Media Queries correctly.

Community feedback

  • roswell•140
    @welpmozPosted about 1 month ago

    Great job, Rodrigo! I noticed you used the footer tag accurately to place the attribution (I definitely need to implement that in my upcoming projects). The design looks good across different screen sizes.

    However, when I inspect the code using the inspection tool, the footer content extends outside of the body content.

    Marked as helpful
    0
    Rodrigo Policarpo Meireles•40
    @Rodrigo-PolicarpoPosted about 1 month ago

    Thanks for the feedback @welpmoz ! I will check and fix this footer mistake as soon as possible!

    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