Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

3 column preview with grid and flexbox

@Kashyap-Pandya

Desktop design screenshot for the 3-column preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


check out this 3column preview site, let me know if there is a better way to do things, feedbacks are highly appreciated. i was really stuck with link activate state for 4 hours, Yeah crazy right ! finally figured it out yey.

Community feedback

Account Deleted

You are missing the hover states on the buttons, and your cards should have a border radius.

1

@Kashyap-Pandya

Posted

@thulanigamtee hi, appreciate you looking at my code i thought the we were given only active state, not hover state. as given in the images. or am i missing something.

about border-radius, i used grid and i couldn't figure out how to remove space between the column gap, so i used margin on the parent to make it all squashed . so now border- radius is happening on the parent. i would really appreciate if you can give me a direction i should look into to solve that.

thank you

1

Account Deleted

@Kashyap-Pandya

My bad, active states are hover states.

1

@Sk7867

Posted

Hi KASHYAP PANDYA, Along with what @Thulani Gamteni suggested, add margin: 20px or any value to section in mobile and tablet view, that way your section won't take the whole screen in those views.

0

@Kashyap-Pandya

Posted

@Sk7867 yeah i did that, but i thought whole width looked better so i didn't and removed it.

0

Please log in to post a comment

Log in with GitHub
Discord logo

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