QR-code-component-main Using Only HTML CSS #

Community feedback

• 

  hitmorecode•6,680

  @hitmorecodePosted about 1 year ago

  • You don't need to add margin on the body, you can remove it.
  • Always use min-heigh: 100vh; instead of height: 100vh;
  • For this challenge you only need one media query.
  • Lines that are commented out, can be removed.
  • You need to place all text in the middle text-align: center;

  body {
      display: flex;
      align-items: center;
      justify-content: center;
      min-height: 100vh; /**/
  /*     margin: 0; */
      background-color: hsl(220, 15%, 55%);
      font-family: 'Barlow Semi Condensed', sans-serif;
  }
  
  @media (max-width: 375px) {
  /*     body {
          align-items: flex-start;
      } */
      .container {
          width: 250px;
  /*         height: auto; */
  /*         margin: 10px; */
  /*     }
      .container .photo {
          width: 100%;
          height: 150px;
          margin: 0;
      }
      .container .content {
          margin-left: 0;
          width: 100%;
      } */
  }
  

  1
• 

  Akhatmirzo•320

  @AkhatmirzoPosted about 1 year ago

  Very cool. But you need to adjust width and height. I would advise you to use Flex for css. Please do more with Colors. In the existing Design: pay attention to the views of the background and the text.

  0