Vlastnost float a několik bloků v CSS
Nyní nechť vedle sebe v HTML kódu není jeden
potomek div, ale dva a oběma je nastaven float
s hodnotou left. Podívejme se,
co se 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, jak vidíme, dva bloky-potomci se seřadily do řady, přičemž první blok v HTML kódu bude umístěn vlevo.
Nyní místo hodnoty left
napišme hodnotu right. V tomto případě
se bloky budou posouvat vpravo, přičemž pořadí
se změní na opačné oproti pořadí
v HTML kódu:
<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;
}
: