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 trialBrett Barton
Front End Web Development Techdegree Student 6,025 PointsChanging font-size to 0.9em, Quiz Question
The question asks to change the font-size to 0.9em, remove padding, margins, and change list-style to none.
My code:
.contact-info ul { font-size:0.9em; padding: 0; margin:0; list-style: none; }
When I click Check Work, it says that I have not changed the font-size to 0.9em.
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 ul {
font-size: 0.9em;
margin: 0;
padding: 0;
list-style: none;
}
2 Answers
andren
28,558 PointsWhile Bogdan Cabaj's answer will allow you to pass this challenge it is technically incorrect.
The task specifically asks you to select ul
elements with a class of .contact-info
. By removing the ul
you end up selecting all elements with a .contact-info
class, which works in this scenario but is not technically correct.
The correct answer is this:
ul.contact-info {
font-size:0.9em;
padding: 0;
margin:0;
list-style: none;
}
ul.contact-info
combines a tag selector ul
and a class selector .contact-info
which results in the correct behavior (only selecting ul
elements with a .contact-info
class). The selector you were using .contact-info ul
was actually selecting ul
elements nested inside elements with a .contact-info
class, which is different and incorrect.
Bogdan Cabaj
16,349 PointsRemove UL from your selector. Somebody else asked the same question couple days ago. People tend to get confused when tag gets mentioned along side class name.
.contact-info {
}
Brett Barton
Front End Web Development Techdegree Student 6,025 PointsBrett Barton
Front End Web Development Techdegree Student 6,025 PointsThanks andren!