Responsive landing page using flexbox

Community feedback

• 

  Abd Ur Rehman•360

  @A-noob-in-CodingPosted 3 months ago

  Hi there, you did a good job in this solution, however here are some things you used consider in your next project:

  • For images use the figure semantic tag for better accessibility, you used to have a empy div and used the QR image as background instead:

  In html

  <figure>
  <img src = "qr-image">
  </img>
  </figure>
  

  In CSS:

  img{
  width: 100%;
  height:auto;
  display: block;
  }
  

  In this way all you need to have this figure in a container and the image will resize automatically for a responsive desing, you would need to remove the default margin of the <figure></figure> element

  Also you are using an extra div for cover the full screen width, you could apply this to body instead of less lines of code

  Hope it is helpful for you 🥰

  1