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

Yaroslav 90

@Bisyk

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

Community feedback

P

@radektomasek

Posted

Hello Yaroslav 👋,

I had some time to have a look at the code and here are some observations/recommendations that you can apply:

  • You might consider using CSS properties to define your variables. If you look at your CSS code, you are duplicating some stuff like colors/fonts. You can reduce that repetition by declaring the properties and then applying them. More info here.

  • You are using absolute units in places where you might consider using relatives ones. A good example is font-size. If you use absolute units (pxs), you are putting some unnecessary barrier for people with accessibility needs. If they change the default font size in the browser settings (making fonts bigger), there won't be any change on your site because of absolute units. You need to use relative units like rem, em ideally. Here is a good article if you would like to learn more.

Otherwise, well done with the implementation.

Have a great day. Radek

Marked as helpful

1

Yaroslav 90

@Bisyk

Posted

@radektomasek Many thanks for your feedback. I will use your advice in the future to make my works even better.

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