Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS Unused CSS Stages Media Queries Adaptive Layouts with Media Queries

.logo { float: left;} wrong?

I am pretty certain that this is correct but according to the result, I keep getting it wrong. My float left as @gil instructs in the lesson. When I preview my code before I click to submit my answer, it is correct. What am I doing wrong?

This is my entire css code:

@media only screen and (min-width: 769px) { .logo { float: left; } .main-nav { float: right; } .main { width: 40.25531914894%; } .extra { display: block; width: 23.405255319149%; } }

Thanks for your help!

Marc

1 Answer

Gareth Borcherds
Gareth Borcherds
9,372 Points

I'm not sure if you put it all in there correctly and it's tough to see with the lack of formatting. I think there might be something small wrong? You can compare you full code with this. This passed all the tests.

/* Complete the challenge by writing CSS below */

/* Phones to Tablets */


@media only 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;
}
}

@media only screen and  (min-width: 1000px) {
  .wrap {
    width : 980px;
  }
}

Thanks a lot Gareth Borcherds. I was just a weird situation. I copied what I did into a text editor and restarted the code challenge. I then copied the code from my text editor and pasted it back into the code challenge and it worked. Looked just like yours. I appreciate the quick response. Dev On!!!