Fleks Elemente in CSS
Benewens die tipes blokmodelle wat ons reeds bestudeer het,
is daar nog een - fleks elemente. Om sulke elemente te kry,
moet die ouer
van hierdie elemente die eienskap display
met die waarde flex geskryf word. Die ouer self sal
'n blokelement bly, maar sy nakomelinge sal
fleks elemente word.
Fleks elemente kan, soos blokelemente, breedte en hoogte hê,
margin en padding.
Maar, in teenstelling met blokelemente, word fleks elemente
by verstek in 'n ry binne hul ouer gerangskik.
Kom ons probeer:
<div class="parent">
<div class="child">1</div>
<div class="child">2</div>
<div class="child">3</div>
</div>
.parent {
display: flex; /* nakomelinge sal fleks elemente wees */
width: 300px;
height: 200px;
border: 1px solid red;
}
.child {
width: 50px;
height: 50px;
border: 1px solid green;
}
:
