CSS Grid: Use Media Queries to Create Responsive Layouts (issues--)

Tell us what’s happening:

Hello all, I need some help… I try to solve this challenge but I can’t. When I get some hint I found that my result is not different from what I have done. It is the only one challenge that prevent me from having my certification.
Tank you for your help…

Your code so far


.item1 {
  background: LightSkyBlue;
  grid-area: header;

.item2 {
  background: LightSalmon;
  grid-area: advert;

.item3 {
  background: PaleTurquoise;
  grid-area: content;

.item4 {
  background: lightpink;
  grid-area: footer;

.container {
  font-size: 1.5em;
  min-height: 300px;
  width: 100%;
  background: LightGray;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 50px auto 1fr auto;
  grid-gap: 10px;

@media (min-width: 300px){
    grid-template-columns: auto 1fr;
    grid-template-rows: auto 1fr auto;
      "advert header"
      "advert content"
      "advert footer";

@media (min-width: 400px){
    /* change the code below this line */

      "header header"
      "advert advert"
      "content content"
      "footer footer";

  /* change the code above this line */

<div class="container">
<div class="item1">header</div>
<div class="item2">advert</div>
<div class="item3">content</div>
<div class="item4">footer</div>

Your browser information:

User Agent is: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/71.0.3578.98 Safari/537.36.

Challenge: Use Media Queries to Create Responsive Layouts

Link to the challenge:

You just need to change header area and footer area to occupy top and bottom row. No other areas. you don’t need to change advert and content. Therefore,
“header header”
“advert content”
“footer footer”;`

1 Like

actually, if you have completed the projects you can claim the certification - all other challenges are not mandatory

Really!! tank you I did know that.

Tank you for responding. It works now…

How can I actually claim the certification?

you can claim the certification from the settings

Great, now I have my certification…