How to reference a long class name with spaces in CSS?

Doug picture Doug · Mar 27, 2012 · Viewed 74.9k times · Source

I'm trying to style some Drupal output. In particular, I'm trying to reference a class with a super long name (that includes spaces). I'm unclear the syntax for this. Forgive me, I'm a CSS newbie. See:

<article id="node-38" class="node node-article node-teaser contextual-links-region node-even published with-comments node-teaser clearfix" about="/~actionin/node/38" typeof="sioc:Item foaf:Document">
    <header>
        <h2 property="dc:title" datatype=""><a href="/~actionin/node/38">National Nutrition Month: March 2012: “Get Your Plate in Shape”</a></h2> 

I ultimately want to reference the H2 property. I was thinking it would be something like:

.node SOMETHING-HERE .header h2 { declaration; }

I cannot just reference the node, since it is used elsewhere for other purposes. I want to be specific and select only this class:

class="node node-article node-teaser contextual-links-region node-even published with-comments node-teaser clearfix"

Answer

joomlearner picture joomlearner · Mar 27, 2012

Using dots (.) you can combine multiple class as a group

.node.node-article.node-teaser.contextual-links-region.node-even.published.with-comments.node-teaser.clearfix {
 ...
}