title: Target the second and penultimate elements having a specific class with CSS
body: <p>I have the following code that display a posts pagination structure. I'm wondering if it's possible to target via CSS the <strong>second</strong> and <strong>penultimate</strong> elements having the <code>.page-numbers</code> class. If so, how? I have no control over the markup so I cannot add additional classes to it.</p>
  <p>Any help would be appreciated.</p>
  <p><a href="https://i.stack.imgur.com/9Bd5D.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/9Bd5D.jpg" alt="enter image description here" /></a></p>
  <pre><code>&lt;nav class=&quot;pagination&quot;&gt;
      &lt;div class=&quot;nav-links&quot;&gt;
          &lt;a class=&quot;prev page-numbers&quot; href=&quot;https://page.com/page/1/&quot;&gt;Previous&lt;/a&gt;
          &lt;a class=&quot;page-numbers&quot; href=&quot;https://page.com/page/1/&quot;&gt;1&lt;/a&gt;
          &lt;span class=&quot;page-numbers current&quot;&gt;2&lt;/span&gt;
          &lt;a class=&quot;page-numbers&quot; href=&quot;https://page.com/page/3/&quot;&gt;3&lt;/a&gt;
          &lt;a class=&quot;page-numbers&quot; href=&quot;https://page.com/page/4/&quot;&gt;4&lt;/a&gt;
          &lt;span class=&quot;page-numbers dots&quot;&gt;&amp;hellip;&lt;/span&gt;
          &lt;a class=&quot;page-numbers&quot; href=&quot;https://page.com/page/10/&quot;&gt;10&lt;/a&gt;
          &lt;a class=&quot;next page-numbers&quot; href=&quot;https://page.com/page/3/&quot;&gt;Next&lt;/a&gt;
      &lt;/div&gt;
  &lt;/nav&gt;
  </code></pre>