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

HTML How to Make a Website Responsive Web Design and Testing Write CSS Media Queries

Posted by Vince Leung
Vince Leung
1,731 Points

I am sure I did it correctly. It just keeps telling me wrong

Task 2: h2 change to 1.75em

css/main.css 
a {
  text-decoration: none;
}

#wrapper {
  max-width: 940px;
  margin: 0 auto;
}

#logo {
  text-align: center;
  margin: 0;
}

h1, h2 {
  color: #fff;
}

nav a {
  color: #fff;
}

nav a:hover {
  color: #32673f;
}

h1 {
  font-family: Changa One, sans-serif;
  font-size: 1.0em;
  font-weight: normal;
}

img {
  max-width: 100%;
}

#gallery {
  margin: 0;
  padding: 0;
  list-style: none;
}

#gallery li {
  float: left;
  width: 45%;
  margin: 2.5%;
  background-color: #f5f5f5;
  color: #bdc3c7;
}

nav ul {
  list-style: none;
  margin: 0 10px;
  padding: 0;
}

nav li {
  display: inline-block;
}

nav a {
  font-weight: 800;
  padding: 15px 10px;
}

.profile-photo {
  display: block;
  margin: 0 auto 30px;
      max-width: 150px;
  border-radius: 100%;
}

.contact-info {
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 0.9em;
}

.contact-info a {
  display: block;
  min-height: 20px;
  background-repeat: no-repeat;
  background-size: 20px 20px;
  padding: 0 0 0 30px;
  margin: 0 0 10px;
}
@media screen and (min-width: 480px){
  body {
    font-size: 2.5em;
  }
}

@media screen and (min-width: 660px) {

h2 { font-size: 1.75em; }

}

2 Answers

Ryan Dudley
Ryan Dudley
Treehouse Project Reviewer
Ryan Dudley
Ryan Dudley
Treehouse Project Reviewer

I think the problem here is that the first media query is targeting the wrong element. It should be targeting the h1 and not the body.

Vince Leung
Vince Leung
1,731 Points

Well I have already changed them to h1 in first and h2 in the second breakpoint, but It tells the same thing again

Alexander Davison
Alexander Davison
65,469 Points

Please don't make another question on the same code challenge... Just be patient and wait for a reply.

Vince Leung
Vince Leung
1,731 Points

just sorted it, thanks all your comments!

Ivan Bagaric
PLUS
Ivan Bagaric
Courses Plus Student 12,356 Points
Ivan Bagaric
Ivan Bagaric
Courses Plus Student 12,356 Points

I just tried challenge and next code works for me:

@media screen and (min-width: 480px){
  h1 {
    font-size: 2.5em;
  }
}

@media screen and (min-width: 660px) {
  h2 { 
    font-size: 1.75em; 
  }
}
Vince Leung
Vince Leung
1,731 Points

just sorted it, thanks for your comments