I need to add styling between all the components that are between two selectors.
The first selector has an activity class, and the second hover has a state.
When you hover over the sixth element, all elements between the first and sixth should turn gray, as in the screenshot
.day {
border: 1px solid;
}
.day:hover {
background: #CCC;
}
.active {
background: blue;
}<div class="day">-1</div>
<div class="day">0</div>
<div class='day active'>1</div>
<div class="day">2</div>
<div class="day">3</div>
<div class="day">4</div>
<div class="day">5</div>
<div class="day">6</div>
<div class="day">7</div>