difference between element.classname and element .classname selectors in CSS?

Question

I understand that a space between CSS selectors indicates nesting. For example, .funny p would select all paragraph elements within an element of the class "funny", and I would similarly (from this logic) expect div .funny to select all "funny" elements within a div tag. However, I never actually see nested selectors in that form in any documented examples, but see quite a bit of those in the form div.funny. Is this simply nice shorthand for what div. funny would convey, or is there in fact a subtle difference I'm missing here? Thanks!

j08691 · Accepted Answer · 2017-05-01 02:46:34Z

5

div.funny Selects all divs that have the class funny

While

div .funny Selects all elements with the class funny that are descendants of a div.

The space makes a significant difference

answered May 1, 2017 at 2:46

j08691

208k33 gold badges269 silver badges281 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

j08691 Over a year ago

To the anonymous downvoter, care to leave a comment as to what's wrong with this answer?

Pango · Accepted Answer · 2017-05-01 02:46:51Z

-1

div.funny in CSS would target a div with the class name of funny, which is also what you'd get if you were to use that as a jQuery selector.

answered May 1, 2017 at 2:46

Pango

6735 silver badges10 bronze badges

Collectives™ on Stack Overflow

difference between element.classname and element .classname selectors in CSS?

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related