Here is the structure of my HTML code:
<ul>
<li class="myItemClass">item foo</li>
<li class="myItemClass specialItemClass">item foo</li>
<li class="myItemClass">item foo</li>
<li class="myItemClass">item foo</li>
<li class="myItemClass specialItemClass">item foo</li>
<li class="myItemClass specialItemClass">item foo</li> <!-- problem here -->
<li class="myItemClass">item foo</li>
<li class="myItemClass">item foo</li>
</ul>
My challenge lies in creating a CSS style for an item that has both the 'specialItemClass' and follows another item with the same class. How can I achieve this?
In more detail, when an item with the 'specialItemClass' is present, it should have a 2px colored border. However, if two consecutive items have this class, the borders overlap. Thus, I need to add the special border only to items that do not immediately follow another item with the 'specialItemClass'.