I have a div and inside 100 spans with class s2 and one span with class s1. This s1 span can be anywhere inside the div. I want to apply css to only the first s2 span which is after the s1. How to do it in css ?
<div>
<span class="s2"></span>
<span class="s2"></span>
<span class="s2"></span>
<span class="s2"></span>
<span class="s1"></span>
<span class="s2"></span> <<- i want to style this span
<span class="s2"></span>
<span class="s2"></span>
<span class="s2"></span>
.
.
.
.
.
<span class="s2"></span>
</div>
.s1 + .s2 {}
would work in your case.