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

four card feature with Sass

@stephanievanoverberghe

Desktop design screenshot for the Four card feature section coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


What are you most proud of, and what would you do differently next time?

RAS

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

Place the cards as on the desktop design.

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

I would like someone to help me with flexbox on the desktop device.

Community feedback

P
Artiom 100

@Artiom-Deyev

Posted

Congratulations on the completed project!

I took a look at your files in the repo - very good use of variables in css. Also, very good use of "ttf" files for fonts - it's always a prefereable way to implement a font.

I assume you went with the "mobile-first" approach for the repsonivity, which is a very good approach especcially for this project. However, at a desktop breakpoint, I can't see any way you can position the elements accroding to the design using flexbox. I'd suggest you use Grid for this.

The index.html file is well structured and easy to unders, I'd only suggest you use more gaps and comments for the lements to help readability (especially if other developers will be working with the code).

Also, please take a look at the paddings and the font size, because it looks that it differs slightly from the design.

Overall, once you position the elements on the desktop (I suggest you implement the grid for it) and few corrections of the font sizes and paddings, this will look very good.

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