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 Card Component Using HTML & CSS

@SergioZF09

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


1.- It was a bit confusing the sizes to desktop I had to use, because the size of my monitor is different from other monitors. However, I guess I did it well.

2.- I don't know if it would've been better to use another div or something different to group the three sections that I did.

3.- Not now. But, if you see something wrong in the code, you can write a different option or different way to do.

Any feedback is welcomed!!

Community feedback

Pon Huang 210

@ponhuang

Posted

Hello Sergio

The desktop size looks quite ok in my monitor, so I guess there's nothing wrong.

There is one technique that I learned from the course about writing dry code. By setting a reusable class to the elements that you want to apply. For example, in your code, you set 3 times same height and width to each section.

In the case, we can set one class and give the same properties they all need, then we only need to write it once.

I quite like this code writing concept, so share with you, maybe next time you can try it and see how it works.

Have a nice day :)

Marked as helpful

1

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