CODEWITHSUNDEEP
htmlcssclass
Adam Halasz
Adam Halasz

Reputation: 58341

Is there a way to make a clone in CSS?

For example I have this css class:

.class{
   background:#FFF; 
   border:1px solid #ccc
}

And I have this HTML structure:

<ul class="list">
   <li>Item 1</li>
   <li>Item 2</li>
   <li>Item 3</li>
</ul>

And I would like to use the .class on the list. li elements without adding the class="class" to the <li>'s or rewriting the whole class for the <li>'s.

Something like:

.list li{
   .class
}

Is this possible somehow?

Upvotes: 0

Views: 1647

Answers (4)

Alan Haggai Alavi
Alan Haggai Alavi

Reputation: 74262

It is not possible using plain CSS. However, CSS frameworks exist which have these functionalities.

Upvotes: 1

Robusto
Robusto

Reputation: 31893

No, unfortunately that doesn't work. Flex has that concept with 

.myClass {
  styleName: "myStyleName";
}

But CSS doesn't work that way. CSS also needs nested selectors, but I wouldn't want to hang from a rope until that happened.

Upvotes: 1

Lasse Espeholt
Lasse Espeholt

Reputation: 17792

You can let some css be applied to different css selectors with comma ,. So your example would be:

.class, .list li {
   background:#FFF; 
   border:1px solid #ccc
}

Upvotes: 3

Kasumi
Kasumi

Reputation: 921

you know the easier way would be 

.list li, .class {
      whatever css
}

Upvotes: 1

Related Questions