Responsive Four card feature section

Community feedback

• 

  Adriano•38,330

  @AdrianoEscarabotePosted about 2 years ago

  Hi Modade, how are you?

  I really liked the result of your project, but I have some tips that I think you will enjoy:

  To center this section we can use a min-height on the body, so it has a minimum height of 100vh, that is, it will have the minimum height that will be the full size of the screen.

  body {
      min height: 100vh;
  }
  

  The rest is great!

  I hope it helps... 👍

  Marked as helpful

  0
• 

  P

  ania•330

  @ania221BPosted about 2 years ago

  Hello Modade!

  To answer your question: yes, you can place the cards with CSS Grid. One way to do so would be defining rows and columns for the cards:

  .grid_card_one {
  grid-row: 3 / span 2;
  grid-column: 1;
  }
  
  .grid_card_two {
  grid-row: 2 / span 2;
  grid-column: 2;
  }
  
  .grid_card_three {
  grid-row: 4 / span 2;
  grid-column: 2;
  }
  
  .grid_card_four {
  grid-row: 3 / span 2;
  grid-column: 3;
  }
  

  Here's a CSS Grid cheatsheet

  I hope this helps 😊

  0