თვისება float და რამდენიმე ბლოკი CSS-ში
ახლა დავუშვათ, რომ HTML კოდში ერთმანეთის გვერდიგვერდ არის არა ერთი
შვილი div, არამედ ორი და ორივეს აქვს მინიჭებული float
მნიშვნელობით left. ვნახოთ, რა მოხდება:
<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;
}
:
ასე რომ, როგორც ვხედავთ, ორი შვილი ბლოკი განლაგდა ზედიზედ, და HTML კოდში პირველი ბლოკი განთავსდება მარცხნივ.
ახლა მნიშვნელობა left-ის ნაცვლად
დავწეროთ მნიშვნელობა right. ამ შემთხვევაში
ბლოკები მოცურავს მარჯვნივ, და მათი თანმიმდევრობა
შებრუნდება HTML კოდში არსებულ თანმიმდევრობასთან შედარებით:
<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;
}
:
