selector - CSS Select Sibling of An Element with A Specific Sub-Element? -

this 1 trippy. leaning think it's impossible :-(

any idea appreciated.

the snippet below part of larger structure many .step elements.

i need match .steptext elements next .steptitleandimages ul.standard

in other words, match .steptext elements have .step parent has .steptitleandimages child has .stepimages.standard child

<div class="step">   <div class="steptitleandimages">     <h3 class="steptitle"></h3>     <ul class="stepimages standard"></ul>     <div class="clearer"></div>   </div>   <div class="steptext "></div>  **how select elements one?**   <div class="clearer"></div> </div>  <div class="step">   <div class="steptitleandimages">     <h3 class="steptitle"></h3>     <ul class="stepimages medium"></ul>     <div class="clearer"></div>   </div>   <div class="steptext "></div>   <div class="clearer"></div> </div> 

ps: cannot modify html. cannot use other pure css.

this cannot done html structure , pure css. closest solution problem, changing html structure , pure css, move standard class parent tag:

<div class="steptitleandimages standard"> <h3 class="steptitle"></h3> <ul class="stepimages"></ul> <div class="clearer"></div> </div>

this allow use adjacent sibling selector (+), matches the second selector if it's direct next sibling of first, this:

.steptitleandimages.standard + .steptext { /* styles */ }

a more flexible approach use general sibling selector match any sibling preceded first selector, not direct next one:

.steptitleandimages.standard ~ .steptext { /* styles */ }

the :has pseudo-class is in development mozilla, hasn't hit stable browsers yet. it, , html structure, go:

.steptitleandimages:has(.standard) + .steptext { /* styles */ }

unfortunately, can't solve in other way css (and html structure) only.