Order Summary Card — HTML, CSS

Community feedback

• 

  Elaine•11,400

  @elaineleungPosted about 2 years ago

  Hey Juan, I ended up checking out some other solutions you have here, and anyway, just wanted to respond to the note you made on the background. I see that you used a picture element here; I would suggest using a background image here instead since the image really is just for decor and doesn't serve a purpose in the content or message of the card. You can try removing picture element and then add something like this to the body selector:

  body {
     background-image: url("./images/pattern-background-desktop.svg"); // use media query to switch to mobile or vice versa
     background-repeat: no-repeat;
     background-size: contain;
     // you can also use background-position if you need to place it in a very specific location
     // rest of your code
  }
  

  You can also add some margin around the card as right now, when I'm viewing it on my laptop, the top of the card is touching the top of the window.

  Marked as helpful

  1

  ---

  

  Juanca•220

  @juancaorgPosted about 2 years ago

  @elaineleung Hey Elaine 👋,

  Thanks for your feedback, didn't think about that.

  I just implemented your tips on my solution. Really appreciated! 🙌

  0