Skip to content
Submitted 3 months ago

Responsive using css grid

devdocx123•40
@devdocx123
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?

Color Selection.

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

nothing.

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

I think there is no need of any help i have seek while designing this webpage.

Community feedback

  • Younes Atyq•240
    @younes-atyqPosted 3 months ago

    Hello @devdocx123, congrats finishing the challenge!

    I recommend removing the position: absolute property from your card. Given that you're already using Flexbox on the body, it's unnecessary and will require extra effort to adjust spacing for different screen sizes.

    To enhance your card's appearance on various devices, consider setting a fixed width. This will create a more consistent look. For responsive design, explore using media queries to apply different styles based on screen size.

    1
  • Shailesh Chauhan•20
    @shailesh7333Posted 3 months ago

    Hey @devdocx123 Kudos for submitting the solution!

    Initially I developed similar border style for the card, but upon observing closely the right and bottom borders where slight sifted in the given design. I was able to resolve it using box-shadow property.

    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