CSS:n float-ominaisuus lohkoille
float-ominaisuutta ei sovelleta vain
kuviin, vaan myös mihin tahansa muihin lohkoihin.
Tarkastellaanpa tätä.
Oletetaan, että meillä on ylälohko, jolla on luokka parent,
ja sen sisällä on tekstiä ja alalohko
luokalla child. Molemmille lohkoille on asetettu
reunus, ja alalohkolle myös leveys ja korkeus:
<div class="parent">
<div class="child"></div>
some long text
</div>
.parent {
border: 1px solid red;
text-align: justify;
}
.child {
width: 200px;
height: 100px;
border: 1px solid green;
}
:
Asetetaan nyt alalohkon float
arvoksi left - teksti alkaa kiertää
lohkoamme:
<div class="parent">
<div class="child"></div>
some long text
</div>
.parent {
border: 1px solid red;
text-align: justify;
}
.child {
float: left;
width: 200px;
height: 100px;
border: 1px solid green;
}
:
