QR_Code_Mentor

Community feedback

• 

  SIDA•190

  @GSida015Posted 6 months ago

  Hello I saw your solution... I went to your site... saw your code... etc

  Overall its like medium let me correct you...

  1.the container should not be like that you should add that properties to body:

  body{
      font-size: 15px;
      max-width: 1440px; 
      background-color:hsl(212, 45%, 89%) ;
      font-family: 'Outfit';
        }
  

  .container{
              max-width: 1230px;
              height: 100%;
              display: flex;
              margin: 0 auto;
              justify-content: center;
              align-items: center;
          }
  

  2.YOU SHOULDN'T DO MARGIN USING %!!! This ruins your whole structure on responsive:

  card-container{
      background-color: hsl(0, 0%, 100%); 
      border-radius: 15px;
      padding: 16px;
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
  }
  

  Here you dont need margin because you are already make container position it in center by display flex

  3.Is text problem is in responsive text is shortened because you use % in margin... Instead you can:

  card-container img{ border: 1px solid moccasin; width: 100%; border-radius: 10px; }
  

  .primary{
       color:hsl(218, 44%, 22%);
       font-weight:700;
       width: here you can provide exact width and control text-align with it;
       font-size: 1.1rem;
  }
  

  .secondary{
      color:hsl(220, 15%, 55%);
      font-size: 15px;
      font-weight:400;
      font-size: 0.8rem;
      width: here you can provide exact width and control text-align with it;
  }
  

  I hope this helped you

  I would appreciate it if you would mark this comment helpful!

  Marked as helpful

  0
• 

  Kate•60

  @devknightingalePosted 6 months ago

  Looks good, adding the attribution is an interesting idea I wouldn't have thought to do.

  0