Help!

You wouldn't want to just use .contact-info, due to specificity.

Ok, but I would then ask what exactly do we gain by specifically targeting element.class_name vs .class_name when we take into consideration the context of that particular class's styling? The styling is particular to lists and as such would only make sense being applied to list elements. If there are multiple unordered list elements with the class attached to them, the specificity has no discernible effect from just targeting the class name.

Now, I understand that the value of classes relative to id's is that we can apply them to multiple elements, so some could claim that if we do not specifically target the element that the class is attached to, we could be applying styling to some elements we do not wish to who are also carrying this class. But if that is the problem we are facing, given that the class's purpose is to style ulelements, why are we attaching this class to those elements in the first place? If the problem we are facing is that we are simply trying to target a singleul` from all other elements, then we should be using an id rather than a class.

In some cases, you might want the same class name and some specifications from it in another tag. For example if we had some divs we want to call contact-info and we want to keep the font but change the padding and margin (the list-style is irrelevant to the div).

Then we would have:

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

What we get is a well structured CSS were we don't need to specify every style more than enough. We also don't need to specify another class name called contact-info-for-divs etc.

Note: There is wrong having a unique class name for each tag. I'm just trying to explain the cons.

Classes are meant to share properties amongst different elements.

In a situation we could assume .contact-information has already been established, and given some basic formatting:

.contact-information{
color: tomato;
font-size: 200px;
list-style-type: none;
margin: 0 auto;
padding: 10px;
}

I can then use this as a template for creating my specific ul with a class .contact-information

ul.contact-information{
font-size: 100px;
border: 10px solid;
.. and so on
}

If I understand correctly, your way of thinking about it will work; but with more code, and repetitive styling. The style ul.contact-information will inherit all properties from .contact-information, while also being able to modify or add on styles specificly for the ul. This helps if we later want to use .contact-information to style something else.

Just for funsies, I've grabbed a snapshot proving I'm right :P

I'd try same ting and I still got an error, weird. But that's just a task in real life project: the example above is mostly the way to go.

The confusion is actually explainable, in the video for that project, they chose to use a class instead of an id simply so that the learner could be exposed to the css syntax. The scope of the project is so small that you would probably elect to use an id instead under normal circumstances.

No one said it wouldn't work.. I tried both methods, and they work fine...

Sorry for the poorly formatted Mark Down. Obviously still a goofball with that >_>