Skip to content
Submitted about 3 years ago

3 column preview card component with CSS Grid

iliwili•225
@iliwili
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...3-column preview card component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

Hello guys, I think I'm improving my HTML/CSS knowledge bit by bit and I'm enjoying it! For this project I tried CSS Grid, how did I do and how could I improve this?

Community feedback

  • Fluffy Kas•7,715
    @FluffyKasPosted about 3 years ago

    Hey, it's a great looking solution! The only thing that can be a bit better is your border-radius. If you set a background-color for each section, then add the border-radius and overflow: hidden to the container, it will work. Right now, I believe the reason it's not working is that you use the yellowish color as a background for the container element and not for the first child. Very small thing and easy to fix. Good job! :)

    Marked as helpful
    1
    iliwili•225
    @iliwiliPosted about 3 years ago

    @FluffyKas Hey, first of all I would like to thank you for the quick feedback! So I actually knew there was something incorrect with the outcome, but I followed the figma file without looking at the final images and that's why it looks weird.

    I'm going to change it and hopefully not forget looking at the final images of the challenge. Thank you! :)

    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