Responsive Results summary component using CSS grid and media query

Hi Kelly, great job!

• If you are wondering why isn't centered It's because you have to add this:

body {
    display: grid;
    place-items: center;
    min-height: 100vh;
}

Then, remove margin properties from #outer styles.

• If you want to improve shadows, try with this values:

#outer {
    box-shadow: 10px 30px 30px var(--pale-blue);
}

After you apply these It will look perfect.

Hello @StarFilledDonut!

I saw that on your desktop version, your used margin-top to place your card in the middle of the page.

I saw that @MaximilianoDanielGarcia already told you how to do it using Grid, since it's what you're using in this project.

But it's also possible to do it using flex and it's quite similar to what Maximiliano suggested.

Here's how you can do it:

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

Other than that, I think you did a great job!