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 trialTom Greenwood
Courses Plus Student 1,072 PointsCSS code challenge - after the first breakpoint...
The code challenge is not accepting this code (it is at the bottom of the page):
@media screen and (min-width: 660px) { h2 { font-size: 1.75em; }
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.75em;
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) {
h1 {
font-size: 2.5em;
}
@media screen and (min-width: 660px) {
h2 {
font-size: 1.75em;
}
2 Answers
Paul Ogden
7,709 PointsYou may have just missed it in the copy and paste, but it looks like your @media tags are missing their closing }'s
Tom Greenwood
Courses Plus Student 1,072 PointsThanks Paul, although I am pretty sure they are included, as per below - is the below incorrect?
@media screen and (min-width: 480px) { h1 { font-size: 2.5em; }
@media screen and (min-width: 660px) { h2 { font-size: 1.75em; }
Paul Ogden
7,709 PointsIt doesn't look like it. If you count then up you will see an extra { on both of the media queries
Tom Greenwood
Courses Plus Student 1,072 PointsOK - got it now :) Thanks for your help Paul.
Thomas Bukovac
1,832 PointsThomas Bukovac
1,832 PointsWhat am I doing wrong here? The challenge is not accepting the code. See bottom of code.