tibbe09 Posts - Answer Overflow

tibbe09

•Created by tibbe09 on 4/24/2024 in #front-end

CSS how to select first element of consecutive same elements

Is it possible to select the first element of consecutive same elements and maybe change the background-color. Only the first element should be selected if there are multiple elements. If there is only one element it should also be selected. I prepared an example where I want to highlight all first p elements of consecutive p element sequences in the div. I tried fiddling around with :has() and :not() but couldn't get it to work, any help would be appreciated

<div>
  <p>Should be highlighted</p>
  <p>Lorem ipsum dolor sit.</p>
  <p>Lorem ipsum dolor sit.</p>
  <div>DIV: Lorem ipsum dolor sit.</div>
  <p>Should be highlighted</p>
  <div>DIV: Lorem ipsum dolor sit.</div>
  <p>Should be highlighted</p>
  <p>Lorem ipsum dolor sit.</p>
</div>

<div>
  <p>Should be highlighted</p>
  <p>Lorem ipsum dolor sit.</p>
  <p>Lorem ipsum dolor sit.</p>
  <div>DIV: Lorem ipsum dolor sit.</div>
  <p>Should be highlighted</p>
  <div>DIV: Lorem ipsum dolor sit.</div>
  <p>Should be highlighted</p>
  <p>Lorem ipsum dolor sit.</p>
</div>

12 replies

Gaming

Programming