Need Help with Media queries challenge

Question

Can't find what I`m doing wrong, can anyone help please with this challenge?
Under "Tablets to Desktop," create a new media query that floats .logo left and .main-nav right if the viewport is 769px or wider. Then, add all other "Tablets to Desktop" rules inside the media query. Finally, create a new property inside the .extra rule that displays it as a block element.
/* Phones to Tablets */
@media screen and (min-width: 481px)
  {
    .col
    { 
      float:left;
    }
.main {
    width: 65.957446808511%;
}
.secondary {
    width: 31.914893617021%; 
}
.secondary,
.extra {
    margin-left: 2.127659574468%;
}
/* Tablets to Desktop */
@media only screen and (min-width: 769px)  
{
  .logo
  {
    float: left;
  }
  .main-nav
  {
    float: right;
  }
.main
  {
    width: 40.425531914894%;
  }
.extra {
    width: 23.404255319149%;
  display: block;
}
}

Giorgi Gulua · Answer

Thank you very much

Nicole H · Answer

It looks like you may have left out the closing curly bracket under the Phones to Tablets media query:
```css
/* Phones to Tablets */
@media screen and (min-width: 481px) { 
   .col { 
      float: left; 
   }
   .main { 
      width: 65.957446808511%; 
   } 
   .secondary { 
      width: 31.914893617021%; 
   } 
   .secondary, .extra { 
      margin-left: 2.127659574468%; 
   }
}
```

Welcome to the Treehouse Community

Looking to learn something new?

Giorgi Gulua

Giorgi Gulua

Need Help with Media queries challenge

2 Answers

Nicole H

Nicole H

Giorgi Gulua

Giorgi Gulua