Order summary card solution

Community feedback

• 

  Mateus Mattos de Sá Barreto•180

  @MMattossPosted over 1 year ago

  Good job finishing the challenge! One thing that I learned in CSS that is helping me a lot in these easier challenges is using flexbox and reseting the standard CSS. Usually I always start my stylesheet with this when I only have one item that I want in the center of the website:

  *{ margin: 0; padding: 0; box-sizing: border-box; }

  body{ width: 100%; height: 100vh; display: flex; align-items: center; justify-content: center; }

  Marked as helpful

  0
• 

  Gabriel Ivan Carrillo•150

  @GabrielCarrillo93Posted over 1 year ago

  One solution I was pointed out here was to use a grid and place the items in the center like this in the css of the project:

  body{ display: grid; place-items: center; }

  You can also use a min-height: 100vh but that is if you need it for the project to look a certain way.

  Hope this helps

  Marked as helpful

  0
• 

  Francesco Merighi•930

  @francescomerighi1202Posted over 1 year ago

  Hi there, nice solution!

  With grid to place your card in the center of the page you have to use ‘place-content: center’ instead of ‘place-items’ and you have to set a ‘min-height: 100vh’ to the parent container.

  I hope I was helpful! (If so, I ask you to mark the comment as useful)

  In any case, don't hesitate to look at my solution if you need it ;)

  0