Social Proof Section

Community feedback

• 

  Trey•290

  @willettoPosted over 2 years ago

  Hey Will! The 2 background .SVGs gave me a lot of trouble. This is the code that ended up working for me:

  body { background-image: url('images/bg-pattern-top-mobile.svg'), url('images/bg-pattern-bottom-mobile.svg'); background-position: top left, right bottom; background-repeat: no-repeat; background-size: 95%, 100%; }

  With the background-image you can add multiple files separated with a comma, and then that comma also applies to the background-position. My % size is my best guess based on the design.

  Marked as helpful

  0

  ---

  

  Will•210

  @wkan17012021Posted over 2 years ago

  @willetto Thanks Trey, strangely this works on vs code live server but still does not appear to show when i host the project on github.

  0

  

  Trey•290

  @willettoPosted over 2 years ago

  @wkan17012021 Huh. That's odd. It does for me. My only idea is to add an ellipse to the img URL in your CSS. "url(.../images/bg-pattern-bottom-mobile.svg"

  0
• 

  Shashree Samuel•9,260

  @shashreesamuelPosted over 2 years ago

  Good job with this challenge, keep up the good work.

  I presume that if you increase the negative margin-left and margin-right on the center card ( 2nd Card from left ) then you should have your solution either matching with the design or close to the design.

  I hope that helps

  Cheers, Happy coding 👍

  Marked as helpful

  0

  ---

  

  Will•210

  @wkan17012021Posted over 2 years ago

  @TheCoderGuru Yes correct the gap between the cards was a bit wider than that in the design. Thanks.

  I don't suppose you know why the background light-purple svgs are not showing in the preview code? They show up on my live server in vs code. Presumably broken url links. This has not happened before on previous FEM challenges...

  1