Polsterung Einstellung je nach Anzahl der untergeordneten Elemente

Question

Ich habe ein DIV Element, das 1 oder 2 Child DIVs

enthalten Gibt es eine Möglichkeit zu sagen, der ist es 1 Child element dann sollte die Polsterung 15px anders sein 5px

Es kann wie

<div class="container"> 
    <div><strike>7.00</strike></div> 
    <div>5.00</div> 
</div> 

oder

<div class="container"> 
    <div>7.00</div> 
</div> 

Answer 1

Sie können in den Kindern einen Trick mit Marge tun, um die gleiche Wirkung zu erhalten:

.container div:only-child { 
 
    margin: 15px; 
 
} 
 

 
div { 
 
    border: solid 1px red; 
 
} 
 

 
div div { 
 
    margin: 0 5px; 
 
    border-color: green; 
 
    background: #ccc; 
 
} 
 

 
div div:first-child { 
 
    margin-top: 5px 
 
} 
 

 
div div:last-child { 
 
    margin-bottom: 5px 
 
}

<div class="container"> 
 
    <div><del>7.00</del></div> 
 
    <div>5.00</div> 
 
</div> 
 

 

 
<div class="container"> 
 
    <div>7.00</div> 
 
</div>

PS Verwenden del-Tag statt strike die

Answer 2

veraltet Nein, da ist nicht.

CSS hat einige komplexe quantity queries, aber diese werden nur die Kinder basierend auf ihrer Nummer stylen.

Es ist (derzeit) nicht möglich, die Mutter basierend auf der Anzahl der Kinder zu gestalten, da es keine Parent Selector