Skip to content
Submitted over 2 years ago

Order Summary Component

Christopher Long•20
@cvalong
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Order summary component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

I'm still super unsure on how to use shadows and when to use box vs drop-shadow

Community feedback

  • Sam•230
    @samd1aPosted over 2 years ago

    Hi Christopher! Your design is brilliant.

    Box & drop shadows both achieve similar results, however box-shadows can be used to create inner inset shadows inside of a element which currently cannot be done in drop-shadows.

    However, drop-shadows can generate shadows around irregular shapes & the alpha channel inside the image, whereas a box-shadow would create a rectangular shadow completely ignoring the alpha channel.

    A more in-depth comparison can be found here: https://css-tricks.com/breaking-css-box-shadow-vs-drop-shadow/

    Hope i can help a little bit. Keep coding!

    0

Please log in to post a comment

Log in with GitHub

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