Loop Studios built with HTML, SASS/SCSS, JS

Community feedback

• 

  バレンタイン 😈•64,170

  @VCaramesPosted about 2 years ago

  Hey @nyrellcl

  This is NOT how to create a responsive landing page.

  You need to use the correct properties and elements to make your content respond to different screen sizes.

  For example, this challenges requires the use of two images for different breakpoints. The Picture Element will facilitate this.

  Syntax:

    <picture>
      <source media="(min-width: )" srcset="">
      <img src="" alt="">
    </picture>
  

  Source:

  https://www.w3schools.com/html/html_images_picture.asp

  https://web.dev/learn/design/picture-element/

  You need research and learn how to properly create responsive content.

  Here are few links to get you started:

  Google Developers

  https://web.dev/learn/design/

  Mozilla

  https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Responsive_Design

  Marked as helpful

  1

  ---

  

  Nyrell Leonor•400

  @nyrellclPosted about 2 years ago

  Hello @vcarames, Thank you so much for the feedback. Im reviewing your links and restarting my project! I haven’t used the <picture> as much as I should. Now that you’ve brought it up, i will use it alongside the <img> tag. This’ll certainly help me in improving the whole project. Thanks again for the honest reply, this was very much needed! Time to get back at it! Haha

  0

  

  Nyrell Leonor•400

  @nyrellclPosted about 2 years ago

  @vcarames Update: <picture> is actually the best thing ever loolll. Cheers for that!

  0

  

  バレンタイン 😈•64,170

  @VCaramesPosted about 2 years ago

  @nyrellcl

  I feel the same way about the picture element. Once I found out about it, it made my projects easier to do.

  0