How to reference a div with class="name1 name2"?

I'm working on some CSS from a tutorial, a div has this class:

<div class="related products">

How can I reference it in the 开发者_JAVA技巧stylesheet?

The div actually has two classes, related and products. You can reference it in your stylesheet with either .related or .products, and it will pick up the styles from both of those rules. For example, with the following CSS, the text in the div in your question would appear red with font size 12:

.related { color:#ff0000 }
.products { font-size:12px }

If you want to select elements with both classes, use .related.products in your stylesheet. For example, add the following to the above example:

.related.products { font-weight:bold }

And the text in your div will receive all three rules, because it matches all 3 selectors. Here's a working example.

div.related.products is the general method

You reference it by div.related.products which literaly translates to "a div with class of related and class of products".

Or, you could reference it by using either class names, since it will catch both.

jsFiddle Example.

In the css, just put the name class of the div by doing this:

.related products {
/*styling to go here*/
}

Now any styling within the related products class will be applied to that div.