Testimonial - Grid

Community feedback

• 

  Ahmet Kabacali•450

  @ahmetkabacaliPosted almost 2 years ago

  hi,

  I checked your code but there are many encoding error. I can make some suggestions.

  • Dont use <br> in grid section.
  • Give the grid a height and width or give them to its container .
  • There are 4 grids, not 3. change with this .grid{grid-template-columns: repeat(4, 1fr);}
  • Use 'grid-area' each grid at this challenge. The grid-area property specifies a grid item's size and location in a grid layout.

  .daniel{ grid-area: 1 / 1 / span 1 / span 2; }
  .jonathan{ grid-area: 1 / 3 / span 1 / span 1; }
  .kira{ grid-area: 1 / 4 / span 2 / span 1; }
  .jeanette{ grid-area: 2 / 1 / span 1 / span 1; }
  .patrick{ grid-area: 2 / 2 / span 1 / span 2 }
  

  • Remove all width and height from person grids. The grill will still fit them. Like this .jonathan{ width: 40%; height: 40%; }

  • Dont use margin:10px 10px this is same with margin:10px and i recomended use "rem" and "em".

  • Don't use margin between grids if there is no major reason. You can use gap:10px.The gap property defines the size of the gap between the rows and columns in a grid layout.

  I'm no expert either, but these are some of the ones I've seen. i hope i helped.

  Good coding:)

  Marked as helpful

  0