Css cheatsheet > Select next child

select next child

Select the next child of a given type.

#css#selector


                


<style>
    .first-element > .next-element{ border: 1px solid }
</style>

<span class="first-element">
    <span class="next-element">Item</span> <!--  this gets selected  -->
    <span class="next-element">Item <!--  and this -->
        <span class="next-element">Item</span> <!--  this does not  -->
    </span>
</span>
    
    Output:

        


    Item 
    Item 
        Item

copy