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 section html css beginner solution

@violaClara

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


I made the 4 card section with css-position property is it ok to do that? How do that with float or flex?

Community feedback

argel omnes• 1,800

@argelomnes

Posted

Hey Viola,

For learning purposes, yes. For client work, no. My suggestion is to use grid. Second best choice is flexbox. You can also combine these two.

I also recommend organizing your files. Like grouping svgs inside an 'image' folder and a 'font(s)' folder for font(s). Speaking of fonts, you haven't linked yours yet. You can directly link it from here. Choose only the styles you need and it will generate the link ready for use. Note: You won't need the font file/folder anymore if you do this.

You also missed the mobile layout. Google recently launched Learn Responsive Design. Some sections are still in the works but you should definitely bookmark it. Frontend Mentor also has a resource section if you want to explore more.

Cheers!

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