Question

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 stylesheet?

Answer 1

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.