Skip to content
  • Unlock Pro
  • Log in with GitHub
Solution
Submitted almost 4 years ago

Order Summary Component using Flexbox

Kobinamd•110
@Kobinamd
A solution to the Order summary component challenge
View live sitePreview (opens in new tab)View codeCode (opens in new tab)

Solution retrospective


This design looks simple but took must of my time. I have a few questions that I need help on.

  1. How do you get the background with both image and color using background shortcut?
  2. How do you prevent the background image from shrinking when you reduce the width of the screen? NB: Try minimizing my design on a large screen.
  3. What is the best practice for handling decorative image like the illustration in this challenge? Do you set it as background or as image like I did?

All feedback to make my code simpler will be appreciated.

Thanks

Code
Loading...

Please log in to post a comment

Log in with GitHub

Community feedback

No feedback yet. Be the first to give feedback on Kobinamd's solution.

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

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License