Not Found
Not Found
Not Found
Your session has expired please log in again.
Your session has expired please log in again.
Your session has expired please log in again.
Your session has expired please log in again.
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Your session has expired please log in again.
Not Found
Not Found
Not Found

Submitted

Mobile first workflow with Flexbox and CSS Custom Properties

@Kristiana12

Desktop design screenshot for the Order summary component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hey all, here is my solution. I would really appreciate some feedback. Thank you :)

Community feedback

@SaifN97

Posted

Great work on this one!👏👏

I'll suggest try using em units for margin / padding.

When you use em units the spacing adjusts automatically depending on the font-size of the element as we shrink things down for mobile view.

Have fun coding :)

1

@AngelusLovell

Posted

@SaifN97 by spacing you mean letter-spacing?

0

@SaifN97

Posted

I meant the spacing created with margin and padding @ShashaGazem

0

@Kristiana12

Posted

@SaifN97 Hey there,

Thank you!! :)

I have never used em units before because I have read that they are difficult to control cause of their parents' inheritance, but maybe it is time to give them a try (but only on margins and paddings)!

Thank you for the tip!! ;)

0

@AngelusLovell

Posted

Your solution is really good.😍

Where did you learn "BEM"?

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