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 trialKevin Bonner
2,302 PointsI don't have the file responsive.css to complete this challenge. How do I complete the challenge without it?
Not sure if this is a bug or not but I can't complete the challenge without the responsive style sheet.
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;
}
Kevin Bonner
2,302 PointsYeah, after resetting the code and pasting it back in a couple times it actually went through. Still not sure what the problem was. Thanks for your help!
3 Answers
Marcelo Pinto
10,198 PointsHi Kevin,
I have tried your challenge and you don't need the "responsive.css" file to complete it. Like Mark Trevathan wrote before, you just need to write the Media Queries at the bottom of the style sheet. I have completed it by using the following CSS rules:
/** Step 1 **/ @media (min-width: 480px) { h1 { font-size: 2.5em; } }
/** Step 2 **/ @media (min-width: 660px) { h2 { font-size: 1.75em; } }
Please tell me if you made it through and, most important, if you understood it.
Kevin Bonner
2,302 PointsHey Marco, yeah I made it through and understand it. I'm wondering if I used the wrong type of bracket somewhere in the code. I kept pasting the same media quires in and resting the editor a couple times and it eventually excepted the code. Maybe there was a period or wrong bracket hiding somewhere in my code that I fixed without noticing. The editor for the challenges is kind of difficult to read on my monitor.
Marcelo Pinto
10,198 PointsGlad to know it was a typing mistake, then. Anyway, thanks for your reply.
Kevin Lawler
Full Stack JavaScript Techdegree Student 5,929 PointsGlad it worked out Kevin!
Sometimes you solve problems without realizing it!
Everything gets to be habit and "instinct" soon enough.
Keep going, and best wishes!
Mark Trevathan
8,153 PointsMark Trevathan
8,153 PointsI don't see a media query in your code, have you tried this?
Depending on the challenge and which track you are on you might have to take out the "screen and" property