CSS float īpašība un vairāki bloki
Tagad pieņemsim, ka HTML kodā blakus atrodas neviens
div-pēctecis, bet divi un abiem ir iestatīts float
ar vērtību left. Apskatīsim,
kas notiks:
<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;
}
:
Tātad, kā mēs redzam, divi bloku-pēcteči sarindojās pēc kārtas, un pirmais bloks HTML kodā atradīsies pa kreisi.
Tagad vērtības left vietā
ierakstīsim vērtību right. Šajā gadījumā
bloki peldēsies pa labi, un to secība
mainīsies uz pretējo, salīdzinot ar
to secību HTML kodā:
<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;
}
: