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 CSS Layout Basics CSS Layout Project Introducing the Project

I haven't been able to edit the media query section of my CSS Style Sheet after making certain changes in it

Hi,

I haven't been able to edit the media query section of my CSS Style Sheet after making certain changes in it - there is currently no effect on any of my code edits (when I save my code and preview the Workspace in my browser, the changes do not show).

I am unsure how to fix this, but have been instructed to post a snapshot of my work so a teacher can help me get to the bottom of this -

Thanks -

https://w.trhou.se/rl47x86sgk

3 Answers

Christian Hals
Christian Hals
11,811 Points

Hi Ramsey,

The code snippet was not my personal code, but copied from the workspace included with the tutorial step.

I checked your personal code and found an error:

/* ---- Page Elements ---- */

.logo {
  height:20%;
  width:20%;
  display:inline-block;
  margin-left:40%;
}


}

/* ================================= 
  Media Queries
==================================== */

You have an extra closing bracket in your code after the logo declaration, and just before your Media Queries.

Try doing a hard refresh on your web-browser. This will clear out any cached pages - which sometimes override the changes you've made. (Happens to me quite frequently).

In Chrome, on Windows, it's Control - Shift - R.

Christian Hals
Christian Hals
11,811 Points

I had the same problem with my project. After some debugging, I found an error with the default workspace stylesheet included with this step. There is a curly bracket missing in the .logo declaration which is causing the media queries to break (in the section "Page Elements" in the style.css file.

/* ---- Page Elements ---- */

.logo {
    width: 190px;

 .headline {
    margin-bottom: 0;
  }

Just add a closing curly bracket and your media queries should work:

.logo {
    width: 190px;
}

Hi Christian,

Are these snippets from your own personal code? I don't seem to see a missing curly bracket in mine.

Thanks -