Ciblage css avec :first-of-type
Bonjour,
voici la page ou se trouve le code: https://la-cascade.io/layout-sur-12-...-avec-flexbox/
voici le code:
Code:
1 2 3 4 5 6 7 8 9 10 11
| <section>
<div class="column">First</div>
<div class="column">Second</div>
<div class="column">Third</div>
</section>
<section>
<div class="column">First</div>
<div class="column">Second</div>
<div class="column">Third</div>
<div class="column">Fourth</div>
</section> |
Code:
1 2 3 4 5 6 7 8 9 10 11 12
| .column {
margin: 10px;
flex-grow: 1;
flex-shrink: 1;
flex-basis: 0;
}
section:first-of-type .column:first-of-type {
flex-grow: 2;
flex-shrink: 2;
flex-basis: 0;
} |
Je ne comprend pas le ciblage : section:first-of-type .column:first-of-type {,
section:first-of-type cible les premiers de chaque type d'élément dans section. Il y à 2 sections, donc, pour moi, mais corrigez moi si je me trompe, celà cible la première Div de chaque section.
.column:first-of-type Là je comprends pas parce que first-of-type est associé à une classe :?
Que veut dire ce ciblage exactement ?