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

three column preview solution

@MaxiJRom

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 my web site, what do you think?

Community feedback

DaftEndev 80

@DaftEndev

Posted

Hello @MaxiJRom. Nice result for this project. I like the organization of your CSS!

Here are some tips I can give you:

-The designs given with the challenge are in true format (1440px for desktop and 375px for mobile usually). So you can open them in an image editing software to check the exact dimensions of the elements.

-You use selector class , while you could directly use an element as a selector. For example: Instead of writing <p class="paragraph white"> and select with .paragraph in your CSS, you can just write p, div p, div > p, or main p as selector in your CSS. Same for your <main> and <h2>, class are not necessary here.

-You should use the semantic element <section> instead of your <div>.

I hope this can help you. keep conding!

Marked as helpful

0

@MaxiJRom

Posted

@DaftEndev I really apreciate your recommendations, will use your tips. Thank you :)

Wich kind of image editing software ?

0
DaftEndev 80

@DaftEndev

Posted

@MaxiJRom I use PhotoFiltre 7 which is free, but there are many other free softwares to do this. You can even use Paint, but it's not practical for measure the elements.

Marked as helpful

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