Flexelement i CSS
Förutom de blockmodelltyper vi har studerat
finns det ytterligare en - flexelement. För att
få sådana element måste föräldern
till dessa element ha egenskapen display
satt till värdet flex. Föräldern förblir
ett blockelement, men dess barn kommer att bli
flexelement.
Flexelement, likt blockelement, kan ha
bredd och höjd, margin och padding.
Men till skillnad från blockelement, är standardbeteendet
att flexelement radas upp på rad inuti
sin förälder.
Låt oss prova:
<div class="parent">
<div class="child">1</div>
<div class="child">2</div>
<div class="child">3</div>
</div>
.parent {
display: flex; /* barnen blir flexelement */
width: 300px;
height: 200px;
border: 1px solid red;
}
.child {
width: 50px;
height: 50px;
border: 1px solid green;
}
:
