Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Combining CSS classes in an element

Tags:

css

This could be the silliest question I've ever made, but why does the text below is not rendered red?

<html>
  <style>
  .c1 .c2 { 
     color: red; 
  }
  </style>
  <body>
     <span class="c1 c2">This should be red</span>
  </body>
</html>

Edit: I want to match elements that contain both c1 and c2 classes, like the example above, no less.

like image 944
rodbv Avatar asked Dec 17 '22 00:12

rodbv


2 Answers

.c1 .c2 matches a c2 element inside a c1 element, just like html body matches a body element inside an html element. Remove the space to match an element with both classes:

.c1.c2 { 
   color: red; 
}
like image 169
John Kugelman Avatar answered Feb 20 '23 10:02

John Kugelman


It should be .c1.c2. The way you have it written is a c2 INSIDE a c1.

like image 22
Mitch Dempsey Avatar answered Feb 20 '23 10:02

Mitch Dempsey