Vetia float dhe disa blloqe në CSS

Le të themi se tani pranë njëri-tjetrit në kodin HTML do të jenë jo një div-fëmijë, por dy dhe të dyve u është caktuar float në vlerën left. Le të shohim çfarë do të ndodhë:

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

Результат:

Pra, siç e shohim, dy blloqet-fëmijë u rreshtuan në një rresht, ku blloku i parë në kodin HTML do të jetë i vendosur majtas.

Tani le të vendosim në vend të vlerës left vlerën right. Në këtë rast blloqet do të notojnë djathtas, ku rendi i tyre do të ndryshojë në të kundërtën krahasuar me rendin në kodin 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

Përsëriteni faqen sipas këtij shembulli: