2nd attempt to correct

Community feedback

• 

  SIDA•190

  @GSida015Posted 6 months ago

  Hello👋!

  I reviewed your code and its great but there are changes to made!!!

  Optional:Most developers as default and global css they use style.css instead of index.css its not necessary as far as I know but its better

  1.Width and height of card needs to be corrected in total it should be width: 320px; and height should be height: 497px; in rems(on default 16px) its width:20rem; height: 31,0625rem;

  2. Distance between the text and Qr-code image should be more... It should be 16px or 1rem you can achieve this by putting texts in one div like this:

  <div class="container">
      <img src="images/image-qr-code.png" alt="QR code" class="qr"/>
        <div class="text-cont">
               <h1> improve your front-end skills by building projects</h1>
                <p>Scan the QR code to visit Frontend Mentor and take your coding skills to the next level</p>
         </div>
    </div>
  

  and add this styles to container in css:

  .container {
       display:flex;
       flex-direction: column;
       align-items: center;
       gap: 16px;  /*or 1 rem if you work with rems*/
  }
  

  you also should add styles to .text-cont:

  .text-cont {
       display:flex;
       flex-direction: column;
       align-items: center;
       gap: 16px;
  } 
  

  or to not use extra lines...

  .container , .text-cont {
       display:flex;
       flex-direction: column;
       align-items: center;
       gap: 16px;
  }
  

  I don't have time to find other issues I hope you figure this out! I hope my comment was helpful. Good Luck In Next Projects!!!! I would appreciate if you mark this comment as helpful!

  Marked as helpful

  1

  ---

  

  brammilevs•60

  @brammilevsPosted 6 months ago

  yeah it was.... thanks@GSida015

  0