a lot of display flex ; a lot of percentages instead of pixels

Community feedback

• 

  Lucas 👾•104,400

  @correlucasPosted about 2 years ago

  👾Hello Nelson, congratulations for your new solution!

  You can avoid the background-image to crop using this property background-size: contain see the fixes below:

  body {
      display: flex;
      background: url(images/pattern-background-desktop.svg) no-repeat;
      background-color: hsl(225, 100%, 94%);
      flex-direction: column;
      justify-content: center;
      align-items: center;
      background-size: contain;
      background-position: top;
  }
  

  Hope it helps!

  Marked as helpful

  0

  ---

  

  nelson•160

  @HyoganPosted about 2 years ago

  @correlucas thank you for your help !!

  0

  

  nelson•160

  @HyoganPosted about 2 years ago

  @correlucas please can you take a small time to look at my code?? it seems that on ftontend mentor website, my "cancel order" button is out of the div, on git github live website it worked properly

  0

  

  Lucas 👾•104,400

  @correlucasPosted about 2 years ago

  @Hyogan Ahh,you need to update the screenshot in the solution panel, there's a button to do it, note that the comparison slider dont update automatically.

  0

  

  nelson•160

  @HyoganPosted about 2 years ago

  @correlucas sorry, i'm not getting you ! Update which screenshot??

  0

  

  Lucas 👾•104,400

  @correlucasPosted about 2 years ago

  @Hyogan this panel in the solution dashboard

  DESIGN COMPARISON
  SOLUTIONDESIGN
  

  0