Die float eienskap en verskeie blokke in CSS
Laat daar nou nie een afstammende div in die HTML-kode wees nie, maar twee, en albei het float
met die waarde left gestel. Kom ons kyk wat sal gebeur:
<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;
}
:
Soos ons kan sien, het die twee afstammende blokke in 'n ry gerangskik, met die eerste blok in die HTML-kode links geplaas.
Kom ons skryf nou die waarde right in plaas van die waarde left.
In hierdie geval sal die blokke regs dryf, en hulle volgorde sal omgekeerd wees in vergelyking met die
volgorde in die HTML-kode:
<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;
}
: