[Solved] How classes work in a CSS file? [closed]

by


In your first example:

.container.inner_content.text_section

Match any element that has all three classes

.container.inner_content.text_section {
  color: red;
}
<div class="container inner_content">one class</div>
<div class="container inner_content">two classes</div>
<div class="container inner_content text_section">all three classes</div>

Your second example is totally different:

.container .inner_content .text_section

Match any element that is a descendant of an element with class .container and also descendant of an element with class .inner_content (that is: a child, or a child of a child, etc.):

.container .inner_content .text_section {
  color: red;
}
<div class="container">
  not this
  <div class="inner_content">
    not this
    <div class="text_section">child</div>
  </div>
</div>

And in your last example:

.container li.inner_content

Match a li element that has class inner_content and is child of an element with class .container (suppose a ul element):

.container li.inner_content {
  color: red;
}
<ul class="container">
  <li>1</li>
  <li class="inner_content">2</li>
  <li>3</li>
</ul>

solved How classes work in a CSS file? [closed]