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 Colum Preview Card Solution

GSD3v08 190

@GSD3v08

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


Any Feedback is Appreciated.

Thank you.

Community feedback

Vanza Setia 27,795

@vanzasetia

Posted

Hi there! 👋

Nice work on this challenge! It's great that the site is using the Normalize and all the page content lives inside a landmark! 👍

However, there are some things that can be improved.

  • The icons are decorative images which means that if those icons don't exist then there will be no missing information. So, I suggest leaving the alt empty so that the screen reader users won't have to listen to the unrelated content.
  • I highly recommend using rem or sometimes em unit instead of px to make sure that everything can scale properly according to user needs. Using px will not allow the users to control the size of the page based on their needs.

I hope you find this information beneficial. Happy coding! 😄

Marked as helpful

0

GSD3v08 190

@GSD3v08

Posted

@vanzasetia Thank you very much for your feedback, I'll use more often rem and em units in next projects, getting used to them it's a little difficult at first and some times I forget to use them.

0
Vanza Setia 27,795

@vanzasetia

Posted

@GSD3v08 You're welcome! 😄

Take it step by step, maybe at first you want to only use rem for all font-size and after that, start using it on margin and padding, and until you've managed to use rem as your main unit instead of px.

Hope my tips help!

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