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 Adding Pages to a Website Add and Style Icons

paul clear
paul clear
2,704 Points
Posted by paul clear
paul clear
2,704 Points

having font-size issues... says to be sure to make font size 0.9em... bug?

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

is this right?

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.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;
}

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

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

2 Answers

paul clear
paul clear
2,704 Points
paul clear
paul clear
2,704 Points

Josue Rodriguez Thank you! This is correct, but contradicts what was taught in the class video. Is this a contemporary approach to CSS, whereas my post of ".contact-info ul {}" would be the "old way" to do this or are they just teaching this incorrectly?

Josué Rodriguez
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Josué Rodriguez
Front End Web Development Techdegree Graduate 24,118 Points
Josué Rodriguez
.a{fill-rule:evenodd;}techdegree seal-36
Josué Rodriguez
Front End Web Development Techdegree Graduate 24,118 Points

paul clear I don't recall the video word for word so in this case I just went with the order in which the challenge was worded:

Select the unordered list with the class contact-info

Ryan S
Ryan S
27,276 Points
Ryan S
Ryan S
27,276 Points

Hi Paul,

Just to clear up some confusion you may have about the way the ul was selected:

The way you wrote it originally will not work the way you may be thinking.

.contact-info ul {
  /* This rule will look for an element with the class name of "contact-info" and 
    select all unordered lists that are contained inside that element. */
}

So in the above case, it is not an incorrect or old way of selecting an element, and is in fact very common. However it is not selecting what the challenge asks for.

As Josue pointed out, you need to select an unordered list with the class name of "contact-info". His post demonstrates this correctly.

Alternatively, you could leave out the <ul> altogether and just select the class directly:

.contact-info {
}

Both will pass the challenge. Hope this helps.