css - Target the first element only if it has other siblings -
without adding classes (or touching html) there way target first element inside div if there second element in div? below html:
<div class="grid"> <div class="content">i want apply css this</div> <div class="content">but if there 2nd .content element in same parent element</div> </div> <div class="grid"> <div class="content">don't apply here</div> </div> <div class="grid"> <div class="content">don't apply here</div> </div> <div class="grid"> <div class="content">i want apply css this</div> <div class="content">but if there 2nd .content element in same parent element</div> </div> a few context better picture ... want center .content if it's .content inside .grid. if there 2 .content divs, want them float next each other.
note:
i know can target second .content
.grid .content:nth-child(2) { ... }
.grid > .content:first-child:not(:only-child) { color: blue; } <div class="grid"> <div class="content">i want apply css this</div> <div class="content">but if there 2nd .content element in same parent element</div> </div> <div class="grid"> <div class="content">don't apply here</div> </div> <div class="grid"> <div class="content">don't apply here</div> </div> <div class="grid"> <div class="content">i want apply css this</div> <div class="content">but if there 2nd .content element in same parent element</div> </div> :first-child:not(:only-child) selector.
Comments
Post a Comment