CODEWITHSUNDEEP
css
Danny
Danny

Reputation: 185

Multiple class selecting in CSS

.upload header {...}

Styling will be applied to any header that is a child of any element with class of '.upload'.

Is it possible to do this?

.upload header, form {...}

Or will I have to specify the class for every type selector ?

Upvotes: 0

Views: 33

Answers (2)

Juan Ferreras
Juan Ferreras

Reputation: 2861

You can't do that. The comma for selector works like the following:

div > nav,
p {
   display: block; 
}

Is exactly the same as writting

div > nav { display: block; }
p { display: block; }

The comma is used to re-use rules, but each selector is global, and does not use the same parent.

In your case, if you want to make the rule only apply to those form elements that are children of .upload, you would have to do

.upload header, .upload form {...}

Upvotes: 2

Rikard Askelöf
Rikard Askelöf

Reputation: 2932

You could do this with two selectors. First set your styles with * and then reset the same styles if you only want it to be applied to the first child element.

.upload *:first-child {
    background: blue;
}

.upload *:first-child *:first-child {
    background: none;
}

Upvotes: 0

Related Questions