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

CSS and BS

P
Basheer-1 130

@Basheer-1

Desktop design screenshot for the Four card feature section coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

P
Mateusz 260

@MateuszZalew

Posted

Hey, good job with the solution! Some tips from me:

  • you can add semantic html elements like <header>, <main> for better accessibility
  • I think heading on top of the page should be an <h1>, you could also style it to match the design by applying lower font-weight to the top text (Reliable, efficient delivery) and wrapping the lower part (Powered by Technology) with bigger font-weight
  • icons inside of the cards are positioned higher in your solution than on the design. You used position which isn't desirable in this case. I would add margin-bottom to the paragraph to push the icon down and then add margin-left: auto to align the icon to the right side of the card.

Overall you did a great job😉! Hope my tips will help you.

Good luck!

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