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

PHP Build a Simple PHP Application Creating the Menu and Footer Adding Active States to the Navigation

Boris Vukobrat
Boris Vukobrat
4,248 Points
Posted by Boris Vukobrat
Boris Vukobrat
4,248 Points

HTML/CSS class attribute with few different names

Nice style.css we have here. I must say Randy pushes my limits at html/css knowledge mercilessly.

At this time I would like to clarify about class name definition that goes with two or more words. Like this one:

<div class="section shirts latest">

So how this works? I noticed .section.shirts selectors in css, but there is no "latest" anywhere?

2 Answers

Rick Yentzer
Rick Yentzer
5,885 Points
Rick Yentzer
Rick Yentzer
5,885 Points

One of the purposes of different class names added to the same element is to apply different styles based on what the element is meant for. You will see this a lot as you progress in learning CSS. It's a way of creating common styling to elements with different needs.

<div class="notice alert">

and

<div class="notice warning">

Each of these would receive the same 'notice' style, but they would each receive the style associated with 'alert' and 'warning'.

Boris Vukobrat
Boris Vukobrat
4,248 Points
Boris Vukobrat
Boris Vukobrat
4,248 Points

Yeah, I researched it already. Thanks. At first it looked like to me as one name with underscore missing : ). It isn't mentioned in previous css course. Now is simple, we can add several classes to the same element.

Aurelian Spodarec
Aurelian Spodarec
7,369 Points

Didn't my answer helped you ? "... its another class in..."etc.. as its what i just said above : p .

Im just asking because I'm curious if you understood what i wrote : p or it was a bad explanation and bad show .

Aurelian Spodarec
Aurelian Spodarec
7,369 Points
Aurelian Spodarec
Aurelian Spodarec
7,369 Points

HI, did you finish the PHP course? if not , he will explain you how this works. Im pretty sure. Just stick with it and then if you feel your lost, re-watch all of it ( or most) and see how it works .

Boris Vukobrat
Boris Vukobrat
4,248 Points
Boris Vukobrat
Boris Vukobrat
4,248 Points

Hi. Well of course I didn't finished it, I am just where above tags say.

This is new interesting css feature to me, and it is used a lot in this project. I don't have much of the css under my fingertips.

It seems to me these names are just alternative class names for same element. Why should we use more class names? Maybe for additional styling, as in the lesson

Aurelian Spodarec
Aurelian Spodarec
7,369 Points

When you write like this , it means as i remember good, that its another class in it. Instead of writing class="x" class="y" etc.. you write class="x y" then you just style it e.g. y{ background:green; etc.. i think you will eventually get it after watching it . But watch with your mind on it. Don't fly away. Hope this helps.