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

Popular posts from this blog

how to insert data php javascript mysql with multiple array session 2 -

multithreading - Exception in Application constructor -

windows - CertCreateCertificateContext returns CRYPT_E_ASN1_BADTAG / 8009310b -