testimonial grid

Community feedback

• 

  Hassia Issah•50,650

  @HassiaiPosted over 1 year ago

  Wrap <div class="attribution"> within the footer tag and the html must have <h1> to fix the accessibility issue.

  Every html must have <h1> to make it accessible. Always begin the heading of the html with <h1> tag wrap the sub-heading of <h1> in <h2> tag, wrap the sub-heading of <h2> in <h3> this continues until <h6>, never skip a level of a heading.

  To center .container on the page using flexbox only instead of flexbox and margin, add min-height:100vh to the main and remove the margin value in .container.

  Give .container a max-width of 1440px , width of 80% or a width of 80vw and display: grid the rest are not needed.

  .container{
  width: 80vw;
   display: grid;
  }
  or
  .container{
  max-width: 1440px;
  width:80%;
  display: grid;
  }
  

  Hope am helpful.

  Well done for completing this challenge. HAPPY CODING

  0
• 

  P

  visualdennis•8,375

  @visualdennissPosted over 1 year ago

  Your solution looks great and perfectly responsive! However i'm viewing this on a notebook with 1280 width and it shows me only one column, i needed to increase browser width even wider to see grid taking effect. So i'd say you could perhaps change the breakpoints a bit and it looks like it is too early (or a too high px value) to switch from desktop layout to mobile layout already. On 1280px viewport width, i shouldn't be already displaying a mobile layout. So my suggestion would be to add some more transitioning layouts, such as perhaps tablet layout etc. If you need some ideas for tablet layout you can also check my solution for this submission. E.g. you can have 2-column layout before 1-column layout for tablets etc.

  Hope you find this feedback helpful!

  0