Хосияти float ва чанд блок дар CSS

Бигзор акнун дар коди HTML наздик як див-фарзанд набошад, балки ду ва ба ҳардуи онҳо float дар арзиши left муайян карда шудааст. Биёед бинем, ки чӣ хоҳад шуд:

html<div class="parent">
  <div class="child">1</div>
  <div class="child">2</div>
  some long text
</div>

css.parent {
  border: 1px solid red;
  text-align: justify;
}
.child {
  float: left;
  width: 200px;
  height: 100px;
  border: 1px solid green;
}

Результат:

Ҳамин тавр, чӣ тавре ки мебинем, ду блок-фарзанд дар як қатор ҷой гирифтанд, ва блоки якум дар коди HTML дар тарафи чап ҷойгир хоҳад шуд.

Акнун ба ҷои арзиши left арзиши right-ро нависем. Дар ин ҳолат блокҳо аз тарафи рост шино карда мешаванд, ва тартиби онҳо нисбат ба тартиб дар коди HTML баръакс иваз мешавад:

html<div class="parent">
  <div class="child">1</div>
  <div class="child">2</div>
  some long text
</div>

css.parent {
  border: 1px solid red;
  text-align: justify;
}
.child {
  float: right;
  width: 200px;
  height: 100px;
  border: 1px solid green;
}

Результат: