Basic card component using a HTML and litle CSS

Community feedback

• 

  imLumarq•210

  @imLumarqPosted over 1 year ago

  Hi Sekou SIDIBE

  Congratulations on completing your first project

  1.You have vertical scrolling due to the default margin on the body.

  Your code

  
  body{
  background: rgb(206, 230, 248) ;
  font-family: 'Inter' ;
  }
  

  Modified code

  
  body{
  background: rgb(206, 230, 248) ;
  font-family: 'Inter' ;
  margin: 0 ; 
  }
  

  2.Remove the min-heigth: 70vh; on the .card{} as this causes the card to always be 70% tall of the device you are viewing it on. This issue can viewed on the on a Ipad mini with a dimensions of 768x1024

  3.Remove the flex-direction: column; on the section{} as this causes you card to overflow on smaller devices. This issue can viewed on the on a Samsung galaxy fold with a dimensions of 280x653

  Here's my solution:

  https://www.frontendmentor.io/solutions/qr-code-component-CmLwve7xsm

  I hope you find this helpful 😄!

  Happy Coding!

  Marked as helpful

  0

  ---

  

  Sekou SIDIBE•80

  @SuperSheykhPosted over 1 year ago

  Thanks for the taking the time. @imLumarq

  0