Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Select all child elements of a class. CSS [duplicate]

Tags:

html

css

Is there a way to apply styles to all the elements of a class directly without having to write like this:

.element-wrapper .coin-box{
  margin: 10px;
  float: left;
}

.element-wrapper .platform{
 margin: 10px;
 float: left;
}

.element-wrapper .goomba{
  margin: 10px;
  float: left;
}
like image 921
Pratish Shrestha Avatar asked Dec 05 '25 00:12

Pratish Shrestha


2 Answers

you can use * selector, for example:

.element-wrapper *{
      margin: 10px;
      float: left;
    }
like image 157
front-end_junior Avatar answered Dec 07 '25 16:12

front-end_junior


Descendent selectors are very similar to child selectors, except that child selectors only select immediate descendents; descendent selectors select matching elements anywhere in the element hierarchy, not just direct descendents. Let's look at what this means more carefully.

CSS:

.element-wrapper >  *
 {
    margin: 10px;
    float: left;
 }

It will work more consistently :-

like image 22
rajesh Avatar answered Dec 07 '25 17:12

rajesh