Fleks elementi u CSS
Pored proučenih tipova blok modela,
postoji još jedan – fleks elementi. Da bismo dobili takve elemente,
roditelju
tih elemenata treba da napišemo svojstvo display
sa vrednošću flex. Sam roditelj će ostati
blok element, ali će njegovi potomci postati
fleks elementi.
Fleks elementi, slično blok elementima, mogu imati
širinu i visinu, margin i padding.
Međutim, za razliku od blok elemenata, podrazumevano
se fleks elementi poređaju u red unutar
svog roditelja.
Hajde da probamo:
<div class="parent">
<div class="child">1</div>
<div class="child">2</div>
<div class="child">3</div>
</div>
.parent {
display: flex; /* potomci će biti fleks elementi */
width: 300px;
height: 200px;
border: 1px solid red;
}
.child {
width: 50px;
height: 50px;
border: 1px solid green;
}
:
