JSFiddle - React, Tailwind, and code Playground

HTML

<div>
  <div class="foo">a - SHOW ME</div>
  <div class="foo">b - HIDE ME</div>
  <div class="foo">c - SHOW ME</div>
  <div class="foo bla">d - HIDE ME</div>
  <div class="foo bla">e - HIDE ME</div>
  <div class="foo bla">f - HIDE ME</div>
  <div class="foo bla">g - SHOW ME</div>
</div>

CSS

.foo:not(:first-child):not(:last-child) {
  display: none;
}
.