All comments

• 

  Dimitar Radev• 930

  @Mitko90

  Submitted over 1 year ago

  Hello,

  This is my solution

  Maybe you can help me with the positioning of the background image. I couldn't make it look like the provided design.

  Thanks in advance

  

  Order Summary Card

  1

  30

  

  lasha_shala• 210

  @Lasha-Nikolaishvili

  Posted over 1 year ago

  Hello Mitko,

  You can correctly position the background image by setting its background-position as top.

  Here are the styles that helped me achieve the desired result:

  body {
      background-color: var(--pale-blue);
      background-image: url(./images/pattern-background-desktop.svg);
      background-repeat: no-repeat;
      background-size: contain;
      background-position: top;
  }
  
  @media (max-width: 700px) {
      body {
         background-image: url(./images/pattern-background-mobile.svg);
      }
  }
  

  The media query is to change the background image when on small screens.

  Marked as helpful

  0