Social Proof Section

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted about 2 years ago

  🔥 Hello Charmonder!

  I've some tips to improve your solution:

  1.The background is applied correctly but in the wrong place, to make it display 100% of the screen background add it to the body instead of the container and make the alignment with min-height: 100vh and flexbox.

  body {
      display: flex;
      min-height: 100vh;
      background-image: url(images/bg-pattern-top-desktop.svg), url(images/bg-pattern-bottom-desktop.svg);
      background-position: left 1px top -16px, right 10px bottom -300px;
      background-repeat: no-repeat, no-repeat;
      background-attachment: fixed, fixed;
      align-items: center;
      justify-content: center;
  }
  

  2.Improve the markup thats built entirely with <div>and you can improve it using semantics tags to describe what its inside each block of content. You can replace the <div> that wraps each card with <article> you can wrap the paragraph with the quote with the tag <blockquote> this way you'll wrap each block of element with the best tag in this situation. Pay attention that <div> is only a block element without meaning.

  I hope this helps you, happy coding!

  Marked as helpful

  1

  ---

  

  charmonder•260

  @charmonderPosted about 2 years ago

  @correlucas Hi Lucas! Thank you so much for the tips, they're very helpful! So, in general, is it better to add background to the body instead of the container whenever we need to apply an image? What if it's just background color? Thank you!

  1

  

  Lucas 👾•104,340

  @correlucasPosted about 2 years ago

  @charmonder If is the main background of the page yes, because this makes sure the image will have the full size and will under everything, note that when the image was in the container it was not displaying the size full width/height

  1