social proof section - achieved this using bootstrap and sass

Community feedback

• 

  Shahin NJ•1,190

  @SJ-Nosrat

  Posted almost 4 years ago

  Hi Tafara, Cool solution! I've taken a look at your code, I've noticed the following in your code:

  body {
    font-size: 15px;
    font-weight: 700;
    height: 100vh;
    padding: 0 10px;
  
    /* YOU HAVE REPEATED THE BACKGROUND-IMAGE TWICE */
    /* The second `background-image` overwrites the first one */
    background-image: url("./images/bg-pattern-top-desktop.svg");
    background-image: url("./images/bg-pattern-bottom-desktop.svg");
    background-repeat: no-repeat;
    background-position: cover; /* INVALID VALUE */
    background-size: contain;
    width: 100vw;
    font-family: "Spartan", sans-serif;
  }
  

  Add the following code for the background-image only, as follows:

   body {
   background-image: url("./images/bg-pattern-top-desktop.svg"), url("./images/bg-pattern-bottom-desktop.svg");
   background-position: top left, bottom right;
  }
  

  top left applies to url("./images/bg-pattern-top-desktop.svg") and bottom right applies to url("./images/bg-pattern-bottom-desktop.svg"). Notice that the values in the background-position are comma separated.

  You can learn more about background-position here.

  Hope the above helps!

  Keep on coding and best of luck with your coding journey!

  01

  Marked as helpful