Vlastnosť float a niekoľko blokov v CSS
Nech je teraz vedľa seba v HTML kóde nie jeden
div-potomok, ale dva a obom je nastavený float
s hodnotou left. Pozrime sa,
čo sa stane:
<div class="parent">
<div class="child">1</div>
<div class="child">2</div>
some long text
</div>
.parent {
border: 1px solid red;
text-align: justify;
}
.child {
float: left;
width: 200px;
height: 100px;
border: 1px solid green;
}
:
Takže, ako vidíme, dva bloky-potomky sa zoradili do radu, pričom prvý blok v HTML kóde bude umiestnený vľavo.
Skúsme teraz namiesto hodnoty left
napísať hodnotu right. V tomto prípade
sa budú bloky posúvať vpravo, pričom poradie
sa zmení na opačné v porovnaní s
poradím v HTML kóde:
<div class="parent">
<div class="child">1</div>
<div class="child">2</div>
some long text
</div>
.parent {
border: 1px solid red;
text-align: justify;
}
.child {
float: right;
width: 200px;
height: 100px;
border: 1px solid green;
}
:
