title: Select all elements of class A that come before element of class B
body: <p>I want to select all elements with class <code>.rating__icon--star1</code> which come before <code>.rating__input1:checked</code>. I want to do this in CSS.</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div class="rating-group1"&gt;
  
            &lt;label aria-label="1 star" class="rating__label1" for="rating1-1"&gt;
              &lt;i class="rating__icon rating__icon--star1 fa fa-star" style="color: orange"&gt;&lt;/i&gt;
            &lt;/label&gt;
            &lt;input class="rating__input1" name="rating1" id="rating1-1" value="1" type="radio"
              [(ngModel)]="this.minStars"&gt;
  
            &lt;label aria-label="2 stars" class="rating__label1" for="rating1-2"&gt;
              &lt;i class="rating__icon rating__icon--star1 fa fa-star"&gt;&lt;/i&gt;
            &lt;/label&gt;
            &lt;input class="rating__input1" name="rating1" id="rating1-2" value="2" type="radio"
              [(ngModel)]="this.minStars"&gt;
  
            &lt;label aria-label="3 stars" class="rating__label1" for="rating1-3"&gt;
              &lt;i class="rating__icon rating__icon--star1 fa fa-star"&gt;&lt;/i&gt;
            &lt;/label&gt;
            &lt;input class="rating__input1" name="rating1" id="rating1-3" value="3" type="radio"
              [(ngModel)]="this.minStars"&gt;
  
            &lt;label aria-label="4 stars" class="rating__label1" for="rating1-4"&gt;
              &lt;i class="rating__icon rating__icon--star1 fa fa-star"&gt;&lt;/i&gt;
            &lt;/label&gt;
            &lt;input class="rating__input1" name="rating1" id="rating1-4" value="4" type="radio"
            [(ngModel)]="this.minStars"&gt;
  
            &lt;label aria-label="5 stars" class="rating__label1" for="rating1-5"&gt;
              &lt;i class="rating__icon rating__icon--star1 fa fa-star"&gt;&lt;/i&gt;
            &lt;/label&gt;
            &lt;input class="rating__input1" name="rating1" id="rating1-5" value="5" type="radio"
            [(ngModel)]="this.minStars"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>For example, this line of CSS gives me all the elements that come after <code>.rating__input1:checked</code></p>
  
  <p><code>.rating__input1:checked ~ .rating__label1 .rating__icon--star1</code></p>
  
  <p>I want to do the opposite. Instead of selecting the elements come after the checked input, I want to get the elements that come before the checked input</p>