title: How can I target a block after another block with css?
body: <p>My html looks like this: </p>
  
  <pre><code>&lt;ul&gt;
    &lt;li class="myItemClass"&gt;item foo&lt;/li&gt;
    &lt;li class="myItemClass specialItemClass"&gt;item foo&lt;/li&gt;
    &lt;li class="myItemClass"&gt;item foo&lt;/li&gt;
    &lt;li class="myItemClass"&gt;item foo&lt;/li&gt;
    &lt;li class="myItemClass specialItemClass"&gt;item foo&lt;/li&gt;
    &lt;li class="myItemClass specialItemClass"&gt;item foo&lt;/li&gt; &lt;!-- problem here --&gt;
    &lt;li class="myItemClass"&gt;item foo&lt;/li&gt;
    &lt;li class="myItemClass"&gt;item foo&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>Now I want to define a css-style for an item that has the 'specialItemClass' and is located after an item that has the 'specialItemClass', too. How can I do that?</p>
  
  <p>Further explanation: The 'specialItemClass' includes having a 2px coloured border. But if two special items are right beneath each other, the borders are doubled. So I don't want to add the special border at the top [or bottom] if there's another special item above [or below].</p>