When the viewport is 400px or more, container class should have a grid-template-areas property in which the footer and header areas occupy the top and bottom rows respectively and advert and content occupy the left and right columns of the middle row

//code to get out this challenge succesfully

Do you have a question?

Hey @BunnyRajput , Whenever you need help with any of the Freecodecamp challenges, use the “Ask For Help” button on your challenge page. It gives the link to the challenge as well as posts the code properly here on forum.

As far as i can guess about this challenge,
Think of your page as a table with 2 columns and 3 rows as follows:

1 2
3 4
5 6
As of now, cell 1 is occupied by "advert" and cell 2 is occupied by "header". What challenge wants you to do is make header occupy both cells 1 and 2 and footer to occupy cell 5 and cell 6. With this hint, try solving now.
1 Like
  grid-template-areas:
    "header header"
    "advert content"
    "footer footer";
2 Likes

Thank you so much. I just had to change the way I was thinking about the problem…