Responsive page using CSS grid

Community feedback

• 

  Corfaya•110

  @CorfayaPosted about 1 year ago

  Hey! Good job! I'll try to answer your questions.

  I don't know if I understood your first question correctly, but, looking at the preview of the site, it seems to me that margins are missing for mobile viewing from the .testimonial-grid. For example,

  .testimonial-grid {
  margin: 50px 0;
  }
  

  To centre all the cards you used flexbox on the body. However, I notice that the container of cards (your 'testimonial-grid') is taking up the whole page. Try setting a width and a height on your container (e.g. 1000x600 px, or some other value, whichever seems more correct to you). In this case, change the flex-direction to 'column' so that the footer does not end up next to the container.

  I'll conclude by suggesting two things:

  • use the required font, you can import it directly from google fonts to CSS. Go to Font Family page, add the required values to the basket and copy the '@import' section as the first line of the CSS. After that, use the font-family property: //CSS font-family property//.

  • you should find in the directory a *.svg for the background quotation mark on the first card. Insert it as background-image.

  I was a bit long-winded, but I wanted to explain myself as best I could. Sorry. Good work!

  0