Nested CSS statements

Question

Can we do nested CSS statements? Instead of repeating classes like:

.hello .world1 {}
.hello .world2 {}

We do something like:

.hello {
   .world1 {}
   .world2 {}
}

Is similar thing possible in CSS/CSS3?

It's not possible with CSS. but there are some preprocessor which might help. Sass and LESS are good preprocessors, you can check those out. — Mudassar Saleem, Feb 19 '18 at 12:06

score 1 · Answer 1 · answered Feb 19 '18 at 12:07

1

It is not possible in CSS but you could do that using SASS.

answered Feb 19 '18 at 12:07

aMJay

score 0 · Answer 2 · answered Feb 19 '18 at 12:09

You could combine child elements using: Child Selector

The child selector selects all elements that are the immediate children of a specified element.

The following example selects all "p" elements that are immediate children of a element:

Example:

div > p {
    background-color: yellow;
}

2 Answers2