Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Request failed with status code 502
Request failed with status code 502
Request failed with status code 502
Request failed with status code 502
Request failed with status code 502
Request failed with status code 502
Request failed with status code 502
Request failed with status code 502
Request failed with status code 502
Request failed with status code 502
Request failed with status code 502
Request failed with status code 502
Request failed with status code 502
Request failed with status code 502

Submitted

3-column-card component with Grid and Flexbox (CSS only)

@said-alrove

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


Hi, what's up? How I mentioned in my last solution, I'm rebuilding some projects that I had already done, but now with the knowledge that I didn't have (in this case, I didn't do too much because I had done this solution with CSS only, so the only difference that I did was in the HTML with the way how I structured it, and with a more organized CSS in contrast to the solution I created some weeks ago).

But as always, feedback is always appreciated :D!.

P.D. I've already said this in the other solution, but anyways it's important to mention it. In this project, I've implemented the use of logical properties such as inline-size (width), and block-size (height) due to nowadays there's already enough browser support for them.

Community feedback

dewslyse 3,025

@dewslyse

Posted

Hello..! Your solution is nice and responsive. I like the way the third card tucks neatly below the preceding two at min-width: 912px. Nice job.

You may want to take a look at your html. You have three h1 elements. Best practice dictates having one h1 per page.

All the best rebuilding your projects.

1

@said-alrove

Posted

@dewslyse Thank you so much :D, I had a little confusion with respect to the headings in the document due to another comment I received in another solution. Have a nice day!.

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