Responsive Media Query struggle!

#1

Responsive Media Query !

Hi, i’m learning my way around designing my own website (a very basic one)

I have a lovely little grid now but wondered how i could make this responsive from a 4 columns, to 3 to 2 to 1, or possibly just 4, 2 & 1 depending on screen size.

I know i’m cheating by just asking you brains instead of researching long and hard but please help.

Here’s what i have at the moment which doesn’t fully work.
Thanks in advance :slight_smile:

 @media screen and (min-width: 768px){
  .gridwrapper {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-auto-rows: 400px;
    grid-gap: 15px;
    max-width: 1100px;
    margin: 0 auto;
  }
}

I’m not even sure if this question should have been asked in the CSS section or here so apologies for that

Thanks C

#2

Thanks for what? You didn’t even ask a question nor described any problem. What should “doesn’t fully work” mean for anyone else?