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 trialyusuf Dibswazit
1,522 PointsBummer! Did you change the h1 font-size to 2.5em for devices larger than 480px? what am i doing wrong?
what am i doing wrong? i have followed each step accordingly
@media screen and (min-width: 480px) {
h1 {
font-size: 2.5em;
}
}
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;
}
1 Answer
jobbol
Full Stack JavaScript Techdegree Student 17,885 PointsSide note: Can we get a moderator to change this code challenge? This exact question appears on a daily basis.
You're changing the h1 style correctly, but further down your CSS there's another another h1 style that overwrites yours. Place your query right after the defaulting h1.
/* Default h1 */
/* small screens */
h1 {
font-family: Changa One, sans-serif;
font-size: 1.75em;
font-weight: normal;
}
/* Query h1 */
/* large screens */
@media screen and (min-width: 480px) {
h1 {
font-size: 2.5em;
}
}
yusuf Dibswazit
1,522 Pointsyusuf Dibswazit
1,522 PointsThank you, i'm such a noob, i should have remembered that code overrides one another in CSS. too much to comprehend at once, but i'm getting there.
Tim Knight
28,888 PointsTim Knight
28,888 PointsThanks for helping with this Josh, unfortunately moderators can make changes to code challenges. I'd suggest reaching out to help@teamtreehouse.com and letting them know about the confusing item with your suggestion for correcting it.