Flex elementai CSS
Be mūsų jau ištirtų blokinių modelių tipų
yra dar vienas - flex elementai. Norint
gauti tokius elementus, reikia tėviniam elementui
nurodyti savybę display
su reikšme flex. Pats tėvinis elementas išliks
blokinis, tačiau jo palikuoniai taps
flex elementais.
Flex elementai, kaip ir blokiniai, gali turėti
plotį ir aukštį, margin ir padding.
Tačiau, skirtingai nei blokiniai, pagal nutylėjimą
flex elementai išsidėsto į eilę savo
tėvinio elemento viduje.
Pabandykime:
<div class="parent">
<div class="child">1</div>
<div class="child">2</div>
<div class="child">3</div>
</div>
.parent {
display: flex; /* palikuoniai bus flex elementai */
width: 300px;
height: 200px;
border: 1px solid red;
}
.child {
width: 50px;
height: 50px;
border: 1px solid green;
}
:
