Clipboard landing page challenge using flex and grid

Community feedback

• 

  P

  Patrick•14,265

  @palgramming

  Posted about 4 years ago

  code start over, code star over, learn, start over learn.... That is the normal that is called progress. The more I try to rebuild things the more I learn and hope it works like that for you.

  Your results look very good the only thing you might want to try is to transition your footer elements to the desktop layout sooner once the view-port become wide enough to accept the elements in the row vs column layout

  11
• 

  John Rey Faciolan•220

  @juani2

  Posted about 4 years ago

  Hello cjeanneau,

  Wow! almost pixel perfect! You might wanna try to adjust the sizing of your background at the header too to match the original design. In my case I used a contain background size and positioned the image on top. (see below snippet):

  body {
      background-image: url("/images/bg-header-mobile.png");
      background-repeat: no-repeat;
      background-position: top;
      background-size: contain;
  }
  

  I can relate to you, at first I thought this challenge will be easy but I was proven wrong when I observed some minor details that needs to be addressed like the changing font sizes, line-heights, letter-spacings, and margins at different view-ports. It took me 5 attempts before I was able to finish the challenge.

  About your css code, all I can recommend is to place comments on your code explaining what the block or line of code will do in your page.

  But overall, great work! It was near pixel perfect!

  01