Testimonials Grid Section

Community feedback

• 

  Lucas 👾•104,400

  @correlucasPosted over 2 years ago

  👾 Hello Charmonder, congratulations for your first junior challenge solution!

  I think you've done pretty much anything in this challenge, seems great.

  There's only two details you can improve:

  🔥1.Card profile photo using a border a little bit bigger because with the value set is not so visible, I think something around 4px should be better.

  🔥2.Setting the media query a little bit earlier, note that around 650px the column are too small and is a little bit hard to read all the paragraph because ins't too wide. So you can set the media query around width: 700px; to change the flow.

  @media (min-width: 750px){
  .grid-main{
    max-width: 1100px;
  }
  
  .top-1{
    background-position: 350px 0;
    grid-column: 1/4;
    grid-row: 1;
  }
  
  .top-2{
    grid-column: 4/5;
    grid-row: 1;
  }
  
  .bottom-1 {
    grid-column: 1/2;
    grid-row: 2;
  }
  
  .bottom-2{
    grid-column: 2/5;
    grid-row: 2;
  }
  
  .right-col{
    grid-column: 5/6;
    grid-row: 1/3;
  }
  
  

  Hope it helps, keep it up!

  1

  ---

  

  charmonder•260

  @charmonderPosted over 2 years ago

  @correlucas Hi Lucas! Thanks for your feedback :) Question -- Is it okay to code the CSS from a mobile-first perspective? And how should I do it if I were to write the desktop code first and use the media query for the mobile design? Because I find it difficult and more complicated to do it this way.

  1

  

  Lucas 👾•104,400

  @correlucasPosted over 2 years ago

  @charmonder Yes, it's okay to code the mobile first, its also kinda harder if we consider that we usually do the opposite. In this case if you write the desktop first, the only difference is that inside the media query will be less code written, but actually the same thing. Mobile first shows that you've a more knowledge and skills to have used this approach, its also a best practice due the fact the majority of the devices are mobile.

  1