Sifa float na vitalu kadhaa katika CSS

Hebu sasa karibu katika msimbo HTML kutakuwa na si moja mtoto wa div, bali mbili na zote zimepewa float katika thamani left. Hebu tuangalie, itakuwaje:

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;
}

Результат:

Kwa hivyo, kama tunavyoona, vitalu viwili-vitoto vilijipanga mstari, na kizuizi cha kwanza katika msimbo wa HTML kitakuwa kimewekwa upande wa kushoto.

Hebu sasa badala ya thamani left tuandike thamani right. Katika kesi hii vitalu vitaelea kulia, na mpangilio wao utabadilika kuwa wa kinyume ikilinganishwa na mpangilio katika msimbo wa 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;
}

Результат:

Задание 1

Rudisha ukurasa kulingana na kielelezo hiki: