Question

I know we can do this in CSS:

div.className p
{
/* some style*/
}

But how can we do

div.className p span
{
/* some style */
} 

to refer to the span in HTML like this:

<div class='className'>
   <p>  <span> Some text </span> </p>
</div>

Answer 1

There’s technically nothing wrong with your selector. I would recommend not including the tag name when it isn’t necessary though, as described by the Google HTML/CSS Style Guide.

It’s easy to get a grip on how selectors work by inspecting elements with Chrome’s inspector. A full selector path is provided, like this: